mirror of
https://github.com/alibaba/lowcode-engine.git
synced 2026-01-25 11:28:18 +00:00
add feature: setSchema and render page
fix : event-dialog bugs
This commit is contained in:
parent
d4ab19a671
commit
2462596fbd
@ -123,6 +123,9 @@ export default {
|
|||||||
const simulatorUrl = [
|
const simulatorUrl = [
|
||||||
'https://dev.g.alicdn.com/ali-lowcode/ali-lowcode-engine/0.9.50/react-simulator-renderer.css',
|
'https://dev.g.alicdn.com/ali-lowcode/ali-lowcode-engine/0.9.50/react-simulator-renderer.css',
|
||||||
'https://dev.g.alicdn.com/ali-lowcode/ali-lowcode-engine/0.9.50/react-simulator-renderer.js',
|
'https://dev.g.alicdn.com/ali-lowcode/ali-lowcode-engine/0.9.50/react-simulator-renderer.js',
|
||||||
|
// for debug simulator
|
||||||
|
// 'http://localhost:3333/js/react-simulator-renderer.js',
|
||||||
|
|
||||||
];
|
];
|
||||||
editor.set('simulatorUrl', simulatorUrl);
|
editor.set('simulatorUrl', simulatorUrl);
|
||||||
// editor.set('renderEnv', 'rax');
|
// editor.set('renderEnv', 'rax');
|
||||||
|
|||||||
@ -33,6 +33,15 @@ export class Project {
|
|||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 替换当前document的schema,并触发渲染器的render
|
||||||
|
* @param schema
|
||||||
|
*/
|
||||||
|
setSchema(schema?: ProjectSchema){
|
||||||
|
let doc = this.documents.find((doc) => doc.actived);
|
||||||
|
doc && doc.import(schema?.componentsTree[0]);
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 整体设置项目 schema
|
* 整体设置项目 schema
|
||||||
*
|
*
|
||||||
|
|||||||
@ -207,7 +207,6 @@ export default function(metadata: TransformedComponentMetadata): TransformedComp
|
|||||||
},
|
},
|
||||||
|
|
||||||
setValue(field: SettingTarget, eventData) {
|
setValue(field: SettingTarget, eventData) {
|
||||||
debugger;
|
|
||||||
const { eventDataList, eventList } = eventData;
|
const { eventDataList, eventList } = eventData;
|
||||||
eventList.map((item) => {
|
eventList.map((item) => {
|
||||||
field.parent.clearPropValue(item.name);
|
field.parent.clearPropValue(item.name);
|
||||||
|
|||||||
@ -48,18 +48,25 @@ export default class EventBindDialog extends Component<PluginProps> {
|
|||||||
// },
|
// },
|
||||||
];
|
];
|
||||||
|
|
||||||
|
private bindEventName :''
|
||||||
|
|
||||||
state: any = {
|
state: any = {
|
||||||
visiable: false,
|
visiable: false,
|
||||||
setterName:'event-setter',
|
setterName:'event-setter',
|
||||||
selectedEventName: '',
|
selectedEventName: '',
|
||||||
eventName: '',
|
eventName: '',
|
||||||
|
bindEventName:'',
|
||||||
paramStr:''
|
paramStr:''
|
||||||
};
|
};
|
||||||
|
|
||||||
openDialog = (bindEventName: String) => {
|
openDialog = (bindEventName: String) => {
|
||||||
|
this.bindEventName = bindEventName;
|
||||||
|
|
||||||
|
this.initEventName();
|
||||||
|
|
||||||
this.setState({
|
this.setState({
|
||||||
visiable: true,
|
visiable: true,
|
||||||
eventName: bindEventName,
|
selectedEventName:''
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -69,9 +76,6 @@ export default class EventBindDialog extends Component<PluginProps> {
|
|||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
componentDidMount() {
|
componentDidMount() {
|
||||||
const { editor, config } = this.props;
|
const { editor, config } = this.props;
|
||||||
editor.on(`${config.pluginKey}.openDialog`, (bindEventName: String,setterName:String,paramStr:String) => {
|
editor.on(`${config.pluginKey}.openDialog`, (bindEventName: String,setterName:String,paramStr:String) => {
|
||||||
@ -96,8 +100,7 @@ export default class EventBindDialog extends Component<PluginProps> {
|
|||||||
}
|
}
|
||||||
|
|
||||||
initEventName = () => {
|
initEventName = () => {
|
||||||
const { bindEventName } = this.state;
|
let eventName = this.bindEventName;
|
||||||
let eventName = bindEventName;
|
|
||||||
this.eventList.map((item) => {
|
this.eventList.map((item) => {
|
||||||
if (item.name === eventName) {
|
if (item.name === eventName) {
|
||||||
eventName = `${eventName}_new`;
|
eventName = `${eventName}_new`;
|
||||||
|
|||||||
@ -17,7 +17,7 @@
|
|||||||
height: 100%;
|
height: 100%;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 35px;
|
top: 38px;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -108,6 +108,8 @@ export default class SourceEditor extends Component<{
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
this.showJsEditor();
|
||||||
|
|
||||||
if (eventName === 'sourceEditor.addFunction') {
|
if (eventName === 'sourceEditor.addFunction') {
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
this.addFunction(params);
|
this.addFunction(params);
|
||||||
@ -218,13 +220,21 @@ export default class SourceEditor extends Component<{
|
|||||||
});
|
});
|
||||||
|
|
||||||
if (key === TAB_KEY.JS_TAB) {
|
if (key === TAB_KEY.JS_TAB) {
|
||||||
|
this.showJsEditor();
|
||||||
|
} else {
|
||||||
|
this.showCssEditor();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
showJsEditor = () => {
|
||||||
document.getElementById('cssEditorDom').setAttribute('style', 'display:none');
|
document.getElementById('cssEditorDom').setAttribute('style', 'display:none');
|
||||||
document.getElementById('jsEditorDom').setAttribute('style', 'block');
|
document.getElementById('jsEditorDom').setAttribute('style', 'block');
|
||||||
} else {
|
}
|
||||||
|
|
||||||
|
showCssEditor = () => {
|
||||||
document.getElementById('jsEditorDom').setAttribute('style', 'display:none');
|
document.getElementById('jsEditorDom').setAttribute('style', 'display:none');
|
||||||
document.getElementById('cssEditorDom').setAttribute('style', 'block');
|
document.getElementById('cssEditorDom').setAttribute('style', 'block');
|
||||||
}
|
}
|
||||||
};
|
|
||||||
|
|
||||||
updateCode = (newCode) => {
|
updateCode = (newCode) => {
|
||||||
const { selectTab } = this.state;
|
const { selectTab } = this.state;
|
||||||
@ -258,7 +268,7 @@ export default class SourceEditor extends Component<{
|
|||||||
let newSchema = transfrom.setFunction2Schema(functionMap, schema);
|
let newSchema = transfrom.setFunction2Schema(functionMap, schema);
|
||||||
|
|
||||||
if (newSchema!='' && JSON.stringify(newSchema) != oldSchemaStr){
|
if (newSchema!='' && JSON.stringify(newSchema) != oldSchemaStr){
|
||||||
editor.get('designer').project.load(newSchema,true);
|
editor.get('designer').project.setSchema(newSchema);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -74,6 +74,13 @@ export default class PageRenderer extends BaseRenderer {
|
|||||||
return '页面schema结构异常!';
|
return '页面schema结构异常!';
|
||||||
}
|
}
|
||||||
debug(`page.render - ${__schema.fileName}`);
|
debug(`page.render - ${__schema.fileName}`);
|
||||||
|
|
||||||
|
this.state = this.__parseData(__schema.state || {});
|
||||||
|
this.__bindCustomMethods(this.props);
|
||||||
|
this.__initDataSource(this.props);
|
||||||
|
|
||||||
|
// this.__setLifeCycleMethods('constructor', arguments);
|
||||||
|
|
||||||
this.__generateCtx({
|
this.__generateCtx({
|
||||||
page: this,
|
page: this,
|
||||||
});
|
});
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user