diff --git a/packages/demo/public/assets.json b/packages/demo/public/assets.json index 70ac9ab9a..674a9696d 100644 --- a/packages/demo/public/assets.json +++ b/packages/demo/public/assets.json @@ -1583,7 +1583,7 @@ "name": "icon", "setter": "IconSetter", "extraProps": { - "defaultValue": "success", + "defaultValue": "", "onChange": { "type": "JSFunction", "value": "(val, field, editor) => {\n field.nodes[0].children.import(val && {\"componentName\": \"Icon\", \"props\": {\"type\": val, \"style\": {\"marginRight\": 5}}}, true); //field.top.setPropValue('children', [{\"componentName\": \"Icon\", \"props\": {\"type\": val}}, (field.top.getPropValue('children') || []).slice(-1)]);\n}" @@ -1592,6 +1592,7 @@ }, { "name": "children", + "title": "文本内容", "setter": { "componentName": "MixedSetter", "props": { @@ -13940,7 +13941,14 @@ "labelPlacement": "ver", "shape": "circle", "animation": true - } + }, + "children": [ + { + "componentName": "StepItem", + "status": "process", + "title": "测试" + } + ] } } ] diff --git a/packages/demo/public/schema.json b/packages/demo/public/schema.json index a935caf05..402a37437 100644 --- a/packages/demo/public/schema.json +++ b/packages/demo/public/schema.json @@ -1 +1 @@ -{"componentName":"Page","id":"node_dockcviv8fo1","props":{"ref":"outterView","autoLoading":true,"style":{"padding":"0 5px 0 5px"}},"fileName":"test","dataSource":{"list":[]},"state":{"text":"outter","isShowDialog":false},"css":"body {font-size: 12px;} .botton{width:100px;color:#ff00ff}","lifeCycles":{"componentDidMount":{"type":"JSFunction","value":"function() {\n console.log('did mount');\n }"},"componentWillUnmount":{"type":"JSFunction","value":"function() {\n console.log('will umount');\n }"}},"methods":{"testFunc":{"type":"JSFunction","value":"function() {\n console.log('test func');\n }"},"onClick":{"type":"JSFunction","value":"function() {\n this.setState({\n isShowDialog: true\n })\n }"},"closeDialog":{"type":"JSFunction","value":"function() {\n this.setState({\n isShowDialog: false\n })\n }"}},"children":[{"componentName":"Box","id":"node_dockcy8n9xed","props":{"style":{"backgroundColor":"rgba(31,56,88,0.1)","padding":"12px 12px 12px 12px"}},"children":[{"componentName":"Box","id":"node_dockcy8n9xee","props":{"style":{"padding":"12px 12px 12px 12px","backgroundColor":"#ffffff"}},"children":[{"componentName":"Breadcrumb","id":"node_dockcy8n9xef","props":{"prefix":"next-","maxNode":100,"component":"nav"},"children":[{"componentName":"Breadcrumb.Item","id":"node_dockcy8n9xeg","props":{"prefix":"next-","children":"首页"}},{"componentName":"Breadcrumb.Item","id":"node_dockcy8n9xei","props":{"prefix":"next-","children":"品质中台"}},{"componentName":"Breadcrumb.Item","id":"node_dockcy8n9xek","props":{"prefix":"next-","children":"商家品质页面管理"}},{"componentName":"Breadcrumb.Item","id":"node_dockcy8n9xem","props":{"prefix":"next-","children":"质检知识条配置"}}]}]},{"componentName":"Box","id":"node_dockcy8n9xeo","props":{"style":{"marginTop":"12px","backgroundColor":"#ffffff"}},"children":[{"componentName":"Form","id":"node_dockcy8n9xep","props":{"inline":true,"style":{"marginTop":"12px","marginRight":"12px","marginLeft":"12px"},"__events":[]},"children":[{"componentName":"Form.Item","id":"node_dockcy8n9xeq","props":{"style":{"marginBottom":"0"},"label":"类目名："},"children":[{"componentName":"Select","id":"node_dockcy8n9xer","props":{"mode":"single","hasArrow":true,"cacheValue":true,"style":{"width":"150px"}}}]},{"componentName":"Form.Item","id":"node_dockcy8n9xes","props":{"style":{"marginBottom":"0"},"label":"项目类型："},"children":[{"componentName":"Select","id":"node_dockcy8n9xet","props":{"mode":"single","hasArrow":true,"cacheValue":true,"style":{"width":"200px"}}}]},{"componentName":"Form.Item","id":"node_dockcy8n9xeu","props":{"style":{"marginBottom":"0"},"label":"项目 ID："},"children":[{"componentName":"Input","id":"node_dockcy8n9xev","props":{"hasBorder":true,"size":"medium","autoComplete":"off","style":{"width":"200px"}}}]},{"componentName":"Button.Group","id":"node_dockcy8n9xew","props":{},"children":[{"componentName":"Button","id":"node_dockcy8n9xex","props":{"type":"primary","style":{"margin":"0 5px 0 5px"},"htmlType":"submit","children":[{"componentName":"Icon","id":"node_dockcy8n9xey","props":{"type":"success"}},"搜索"]}},{"componentName":"Button","id":"node_dockcy8n9xe10","props":{"type":"normal","style":{"margin":"0 5px 0 5px"},"htmlType":"reset","children":["清空"]}}]}]}]},{"componentName":"Box","id":"node_dockcy8n9xe1f","props":{"style":{"backgroundColor":"#ffffff","paddingBottom":"24px","display":"flex","flexDirection":"row","justifyContent":"flex-end"}},"children":[{"componentName":"Button","id":"node_dockd5nrh9p4","props":{"type":"primary","size":"medium","htmlType":"button","component":"button","children":["新建配置"],"style":{},"__events":[{"type":"componentEvent","name":"onClick","relatedEventName":"onClick"}],"onClick":{"type":"JSFunction","value":"function(){ this.onClick() }"}}}]},{"componentName":"Box","id":"node_dockd5nrh9p5","props":{},"children":[{"componentName":"Table","id":"node_dockd5nrh9p6","props":{"dataSource":[{"id1":1,"id2":"2016","id3":"2013","id4":"2014","id5":"2015","id6":"2016","id7":"2017","id8":"2018"},{"id1":1,"id2":"2016","id3":"2016","id4":"2016","id5":"2016","id6":"2016","id7":"2016","id8":"2016"}],"size":"medium","prefix":"next-","hasBorder":true,"hasHeader":true,"isZebra":false,"loading":false,"expandedIndexSimulate":false,"primaryKey":"id","locale":"zhCN.Table","crossline":false,"__events":[]},"children":[{"componentName":"Table.Column","id":"node_dockd5nrh9p7","props":{"title":"一级类目","dataIndex":"id1"}},{"componentName":"Table.Column","id":"node_dockd5nrh9p8","props":{"title":"二级类目","dataIndex":"id2"}},{"componentName":"Table.Column","id":"node_dockd5nrh9p9","props":{"title":"叶子类目","dataIndex":"id3"}},{"componentName":"Table.Column","id":"node_dockd5nrh9pa","props":{"title":"项目类型","dataIndex":"id4"}},{"componentName":"Table.Column","id":"node_dockd5nrh9pb","props":{"title":"项目id","dataIndex":"id5"}},{"componentName":"Table.Column","id":"node_dockd5nrh9pc","props":{"title":"知识条标题","dataIndex":"id6"}},{"componentName":"Table.Column","id":"node_dockd5nrh9pd","props":{"title":"知识条链接","dataIndex":"id7"}},{"componentName":"Table.Column","id":"node_dockd5nrh9pe","props":{"title":"操作","dataIndex":"id8"}}]},{"componentName":"Box","id":"node_dockd5nrh9pg","props":{"style":{"display":"flex","flexDirection":"row","justifyContent":"flex-end"}},"children":[{"componentName":"Pagination","id":"node_dockd5nrh9pf","props":{"prefix":"next-","type":"normal","shape":"normal","size":"medium","defaultCurrent":1,"total":100,"pageShowCount":5,"pageSize":10,"pageSizePosition":"start","showJump":true,"style":{}}}]}]}]},{"componentName":"Dialog","id":"node_dockcy8n9xe1h","props":{"prefix":"next-","footerAlign":"right","footerActions":["ok","cancel"],"closeable":"esc,close","hasMask":true,"align":"cc cc","minMargin":40,"visible":{"type":"JSExpression","value":"this.state.isShowDialog"},"title":"标题","events":[],"__events":[{"type":"componentEvent","name":"onCancel","relatedEventName":"closeDialog"},{"type":"componentEvent","name":"onClose","relatedEventName":"closeDialog"},{"type":"componentEvent","name":"onOk","relatedEventName":"testFunc"}],"onCancel":{"type":"JSFunction","value":"function(){ this.closeDialog() }"},"onClose":{"type":"JSFunction","value":"function(){ this.closeDialog() }"},"onOk":{"type":"JSFunction","value":"function(){ this.testFunc() }"}},"children":[{"componentName":"Form","id":"node_dockd5nrh9pi","props":{"inline":false,"labelAlign":"top","labelTextAlign":"right","size":"medium"},"children":[{"componentName":"Form.Item","id":"node_dockd5nrh9pj","props":{"style":{"marginBottom":"0","minWidth":"200px","minHeight":"28px"},"label":"商品类目"},"children":[{"componentName":"Select","id":"node_dockd5nrh9pk","props":{"mode":"single","hasArrow":true,"cacheValue":true}}]},{"componentName":"Form.Item","id":"node_dockd5nrh9pl","props":{"style":{"marginBottom":"0","minWidth":"200px","minHeight":"28px"},"label":"商品类目"},"children":[{"componentName":"Select","id":"node_dockd5nrh9pm","props":{"mode":"single","hasArrow":true,"cacheValue":true}}]},{"componentName":"Form.Item","id":"node_dockd5nrh9pn","props":{"style":{"marginBottom":"0","minWidth":"200px","minHeight":"28px"},"label":"商品类目","asterisk":true},"children":[{"componentName":"Select","id":"node_dockd5nrh9po","props":{"mode":"single","hasArrow":true,"cacheValue":true}}]},{"componentName":"Form.Item","id":"node_dockd5nrh9pp","props":{"style":{"marginBottom":"0","minWidth":"200px","minHeight":"28px"},"label":"商品类目"},"children":[{"componentName":"Input","id":"node_dockd5nrh9pr","props":{"hasBorder":true,"size":"medium","autoComplete":"off"}}]}]}]}]} +{"componentName":"Page","id":"node_dockcviv8fo1","props":{"ref":"outterView","autoLoading":true,"style":{"padding":"0 5px 0 5px"}},"fileName":"test","dataSource":{"list":[]},"state":{"text":"outter","isShowDialog":false},"css":"body {font-size: 12px;} .botton{width:100px;color:#ff00ff}","lifeCycles":{"componentDidMount":{"type":"JSFunction","value":"function() {\n console.log('did mount');\n }"},"componentWillUnmount":{"type":"JSFunction","value":"function() {\n console.log('will umount');\n }"}},"methods":{"testFunc":{"type":"JSFunction","value":"function() {\n console.log('test func');\n }"},"onClick":{"type":"JSFunction","value":"function() {\n this.setState({\n isShowDialog: true\n })\n }"},"closeDialog":{"type":"JSFunction","value":"function() {\n this.setState({\n isShowDialog: false\n })\n }"}},"children":[{"componentName":"Box","id":"node_dockcy8n9xed","props":{"style":{"backgroundColor":"rgba(31,56,88,0.1)","padding":"12px 12px 12px 12px"}},"children":[{"componentName":"Box","id":"node_dockcy8n9xee","props":{"style":{"padding":"12px 12px 12px 12px","backgroundColor":"#ffffff"}},"children":[{"componentName":"Breadcrumb","id":"node_dockcy8n9xef","props":{"prefix":"next-","maxNode":100,"component":"nav"},"children":[{"componentName":"Breadcrumb.Item","id":"node_dockcy8n9xeg","props":{"prefix":"next-","children":"首页"}},{"componentName":"Breadcrumb.Item","id":"node_dockcy8n9xei","props":{"prefix":"next-","children":"品质中台"}},{"componentName":"Breadcrumb.Item","id":"node_dockcy8n9xek","props":{"prefix":"next-","children":"商家品质页面管理"}},{"componentName":"Breadcrumb.Item","id":"node_dockcy8n9xem","props":{"prefix":"next-","children":"质检知识条配置"}}]}]},{"componentName":"Box","id":"node_dockcy8n9xeo","props":{"style":{"marginTop":"12px","backgroundColor":"#ffffff"}},"children":[{"componentName":"Form","id":"node_dockcy8n9xep","props":{"inline":true,"style":{"marginTop":"12px","marginRight":"12px","marginLeft":"12px"},"__events":[]},"children":[{"componentName":"Form.Item","id":"node_dockcy8n9xeq","props":{"style":{"marginBottom":"0"},"label":"类目名："},"children":[{"componentName":"Select","id":"node_dockcy8n9xer","props":{"mode":"single","hasArrow":true,"cacheValue":true,"style":{"width":"150px"}}}]},{"componentName":"Form.Item","id":"node_dockcy8n9xes","props":{"style":{"marginBottom":"0"},"label":"项目类型："},"children":[{"componentName":"Select","id":"node_dockcy8n9xet","props":{"mode":"single","hasArrow":true,"cacheValue":true,"style":{"width":"200px"}}}]},{"componentName":"Form.Item","id":"node_dockcy8n9xeu","props":{"style":{"marginBottom":"0"},"label":"项目 ID："},"children":[{"componentName":"Input","id":"node_dockcy8n9xev","props":{"hasBorder":true,"size":"medium","autoComplete":"off","style":{"width":"200px"}}}]},{"componentName":"Button.Group","id":"node_dockcy8n9xew","props":{},"children":[{"componentName":"Button","id":"node_dockcy8n9xex","props":{"type":"primary","style":{"margin":"0 5px 0 5px"},"htmlType":"submit","children":["搜索"]}},{"componentName":"Button","id":"node_dockcy8n9xe10","props":{"type":"normal","style":{"margin":"0 5px 0 5px"},"htmlType":"reset","children":["清空"]}}]}]}]},{"componentName":"Box","id":"node_dockcy8n9xe1f","props":{"style":{"backgroundColor":"#ffffff","paddingBottom":"24px","display":"flex","flexDirection":"row","justifyContent":"flex-end"}},"children":[{"componentName":"Button","id":"node_dockd5nrh9p4","props":{"type":"primary","size":"medium","htmlType":"button","component":"button","children":["新建配置"],"style":{},"__events":[{"type":"componentEvent","name":"onClick","relatedEventName":"onClick"}],"onClick":{"type":"JSFunction","value":"function(){ this.onClick() }"}}}]},{"componentName":"Box","id":"node_dockd5nrh9p5","props":{},"children":[{"componentName":"Table","id":"node_dockd5nrh9p6","props":{"dataSource":[{"id1":1,"id2":"2016","id3":"2013","id4":"2014","id5":"2015","id6":"2016","id7":"2017","id8":"2018"},{"id1":1,"id2":"2016","id3":"2016","id4":"2016","id5":"2016","id6":"2016","id7":"2016","id8":"2016"}],"size":"medium","prefix":"next-","hasBorder":true,"hasHeader":true,"isZebra":false,"loading":false,"expandedIndexSimulate":false,"primaryKey":"id","locale":"zhCN.Table","crossline":false,"__events":[]},"children":[{"componentName":"Table.Column","id":"node_dockd5nrh9p7","props":{"title":"一级类目","dataIndex":"id1"}},{"componentName":"Table.Column","id":"node_dockd5nrh9p8","props":{"title":"二级类目","dataIndex":"id2"}},{"componentName":"Table.Column","id":"node_dockd5nrh9p9","props":{"title":"叶子类目","dataIndex":"id3"}},{"componentName":"Table.Column","id":"node_dockd5nrh9pa","props":{"title":"项目类型","dataIndex":"id4"}},{"componentName":"Table.Column","id":"node_dockd5nrh9pb","props":{"title":"项目id","dataIndex":"id5"}},{"componentName":"Table.Column","id":"node_dockd5nrh9pc","props":{"title":"知识条标题","dataIndex":"id6"}},{"componentName":"Table.Column","id":"node_dockd5nrh9pd","props":{"title":"知识条链接","dataIndex":"id7"}},{"componentName":"Table.Column","id":"node_dockd5nrh9pe","props":{"title":"操作","dataIndex":"id8"}}]},{"componentName":"Box","id":"node_dockd5nrh9pg","props":{"style":{"display":"flex","flexDirection":"row","justifyContent":"flex-end"}},"children":[{"componentName":"Pagination","id":"node_dockd5nrh9pf","props":{"prefix":"next-","type":"normal","shape":"normal","size":"medium","defaultCurrent":1,"total":100,"pageShowCount":5,"pageSize":10,"pageSizePosition":"start","showJump":true,"style":{}}}]}]}]},{"componentName":"Dialog","id":"node_dockcy8n9xe1h","props":{"prefix":"next-","footerAlign":"right","footerActions":["ok","cancel"],"closeable":"esc,close","hasMask":true,"align":"cc cc","minMargin":40,"visible":{"type":"JSExpression","value":"this.state.isShowDialog"},"title":"标题","events":[],"__events":[{"type":"componentEvent","name":"onCancel","relatedEventName":"closeDialog"},{"type":"componentEvent","name":"onClose","relatedEventName":"closeDialog"},{"type":"componentEvent","name":"onOk","relatedEventName":"testFunc"}],"onCancel":{"type":"JSFunction","value":"function(){ this.closeDialog() }"},"onClose":{"type":"JSFunction","value":"function(){ this.closeDialog() }"},"onOk":{"type":"JSFunction","value":"function(){ this.testFunc() }"}},"children":[{"componentName":"Form","id":"node_dockd5nrh9pi","props":{"inline":false,"labelAlign":"top","labelTextAlign":"right","size":"medium"},"children":[{"componentName":"Form.Item","id":"node_dockd5nrh9pj","props":{"style":{"marginBottom":"0","minWidth":"200px","minHeight":"28px"},"label":"商品类目"},"children":[{"componentName":"Select","id":"node_dockd5nrh9pk","props":{"mode":"single","hasArrow":true,"cacheValue":true}}]},{"componentName":"Form.Item","id":"node_dockd5nrh9pl","props":{"style":{"marginBottom":"0","minWidth":"200px","minHeight":"28px"},"label":"商品类目"},"children":[{"componentName":"Select","id":"node_dockd5nrh9pm","props":{"mode":"single","hasArrow":true,"cacheValue":true}}]},{"componentName":"Form.Item","id":"node_dockd5nrh9pn","props":{"style":{"marginBottom":"0","minWidth":"200px","minHeight":"28px"},"label":"商品类目","asterisk":true},"children":[{"componentName":"Select","id":"node_dockd5nrh9po","props":{"mode":"single","hasArrow":true,"cacheValue":true}}]},{"componentName":"Form.Item","id":"node_dockd5nrh9pp","props":{"style":{"marginBottom":"0","minWidth":"200px","minHeight":"28px"},"label":"商品类目"},"children":[{"componentName":"Input","id":"node_dockd5nrh9pr","props":{"hasBorder":true,"size":"medium","autoComplete":"off"}}]}]}]}]} diff --git a/packages/designer/src/designer/designer.ts b/packages/designer/src/designer/designer.ts index 3562a9219..9af170b75 100644 --- a/packages/designer/src/designer/designer.ts +++ b/packages/designer/src/designer/designer.ts @@ -432,7 +432,7 @@ export class Designer { designer._componentMetasMap.forEach((config, key) => { const metaData = config.getMetadata(); if (metaData.devMode === 'lowcode') { - maps[key] = metaData.schema; + maps[key] = this.currentDocument?.simulator?.createComponent(metaData.schema!); } else { const view = metaData.experimental?.view; if (view) { diff --git a/packages/designer/src/designer/setting/utils.js b/packages/designer/src/designer/setting/utils.js index 9c740202a..ec2c71bf8 100644 --- a/packages/designer/src/designer/setting/utils.js +++ b/packages/designer/src/designer/setting/utils.js @@ -42,8 +42,7 @@ export class Transducer { } else if (isValidElement(setter) && setter.type.displayName === 'MixedSetter') { setter = setter.props?.setters?.[0]; } else if (typeof setter === 'object' && setter.componentName === 'MixedSetter') { - setter = setter; - setter.props && setter.props.setters && Array.isArray(setter.props.setters) && setter.props.setters[0]; + setter = setter && setter.props && setter.props.setters && Array.isArray(setter.props.setters) && setter.props.setters[0]; } if (isSetterConfig(setter)) { diff --git a/packages/editor-setters/src/index.tsx b/packages/editor-setters/src/index.tsx index 5815fede0..40865c956 100644 --- a/packages/editor-setters/src/index.tsx +++ b/packages/editor-setters/src/index.tsx @@ -8,7 +8,7 @@ import JsonSetter from './json-setter'; import EventsSetter from './events-setter'; import StyleSetter from './style-setter'; import IconSetter from './icon-setter'; -import MixedSetter from './mixed-setter'; +// import MixedSetter from './mixed-setter'; export const StringSetter = { component: Input, @@ -44,7 +44,7 @@ export const DateYearSetter = DatePicker.YearPicker; export const DateMonthSetter = DatePicker.MonthPicker; export const DateRangeSetter = DatePicker.RangePicker; -export { ExpressionSetter, EventsSetter, JsonSetter, MixedSetter }; +export { ExpressionSetter, EventsSetter, JsonSetter, IconSetter }; class StringDateSetter extends Component { render() { @@ -71,21 +71,24 @@ class StringTimePicker extends Component { } } +const VariableSetter ={ + component: ExpressionSetter, + condition: (field: any) => { + const v = field.getValue(); + return v == null || isJSExpression(v); + }, + defaultProps: { placeholder: '请输入表达式' }, + title: '表达式输入', + recommend: true, +}; + const builtinSetters: any = { StringSetter, NumberSetter, BoolSetter, SelectSetter, - ExpressionSetter: { - component: ExpressionSetter, - condition: (field: any) => { - const v = field.getValue(); - return v == null || isJSExpression(v); - }, - defaultProps: { placeholder: '请输入表达式' }, - title: '表达式输入', - recommend: true, - }, + VariableSetter, + ExpressionSetter: VariableSetter, RadioGroupSetter, TextAreaSetter, DateSetter: StringDateSetter, @@ -98,7 +101,6 @@ const builtinSetters: any = { JsonSetter, StyleSetter, IconSetter, - MixedSetter, }; registerSetter(builtinSetters); diff --git a/packages/editor-skeleton/src/components/mixed-setter/index.tsx b/packages/editor-skeleton/src/components/mixed-setter/index.tsx index 6f5ddeeeb..656e8e938 100644 --- a/packages/editor-skeleton/src/components/mixed-setter/index.tsx +++ b/packages/editor-skeleton/src/components/mixed-setter/index.tsx @@ -92,7 +92,7 @@ function nomalizeSetters(setters?: Array