github/lowcode-engine
1
0
Fork 0
mirror of https://github.com/alibaba/lowcode-engine.git synced 2026-01-13 09:41:57 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'polyfill/vision' of gitlab.alibaba-inc.com:ali-lowcode/ali-lowcode-engine into polyfill/vision

Browse Source
This commit is contained in:
zmq248570 2020-05-05 19:24:13 +08:00
commit e52b4c6bb3
13 changed files with 106 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
packages/designer/src/component-meta.ts
View File

@ -20,6 +20,7 @@ import { IconComponent } from './icons/component';
import { IconRemove } from './icons/remove';
import { IconClone } from './icons/clone';
import { ReactElement } from 'react';
import { IconHidden } from './icons/hidden';
function ensureAList(list?: string | string[]): string[] | null {
if (!list) {
@ -341,6 +342,20 @@ const builtinComponentActions: ComponentAction[] = [
},
important: true,
},
{
name: 'hide',
content: {
icon: IconHidden,
title: intlNode('hide'),
action(node: Node) {
node.getExtraProp('hidden', true)?.setValue(true);
},
},
condition: (node: Node) => {
return node.componentMeta.isModal;
},
important: true,
},
];
export function removeBuiltinComponentAction(name: string) {

10
packages/designer/src/document/document-model.ts
View File

@ -461,14 +461,16 @@ export class DocumentModel {
return config.checkNestingDown(parent, obj) && this.checkNestingUp(parent, obj);
}
// ======= compatibles
// ======= compatibles for vision
getRoot() {
return this.rootNode;
}
/**
* 兼容vision
*/
// add toData
toData() {
return { componentsTree: [this.project?.currentDocument?.export()] };
}
getHistory(): History {
return this.history;
}

1
packages/designer/src/locale/en-US.json
View File

@ -1,6 +1,7 @@
{
"copy": "Copy",
"remove": "Remove",
"hide": "Hide",
"Condition Group": "Condition Group",
"No opened document": "No opened document, open some document to editing"
}

1
packages/designer/src/locale/zh-CN.json
View File

@ -1,6 +1,7 @@
{
"copy": "复制",
"remove": "删除",
"hide": "隐藏",
"Condition Group": "条件组",
"No opened document": "没有打开的页面，请选择页面打开编辑"
}

21
packages/editor-skeleton/src/layouts/top-area.tsx
View File

@ -4,23 +4,23 @@ import { observer } from '@ali/lowcode-editor-core';
import Area from '../area';
@observer
export default class TopArea extends Component<{ area: Area }> {
export default class TopArea extends Component<{ area: Area, itemClassName?: string }> {
render() {
const { area } = this.props;
const { area, itemClassName } = this.props;
return (
<div className={classNames("lc-top-area engine-actionpane", {
'lc-area-visible': area.visible
})}>
<Contents area={area} />
<Contents area={area} itemClassName={itemClassName} />
</div>
);
}
}
@observer
class Contents extends Component<{ area: Area }> {
class Contents extends Component<{ area: Area, itemClassName?: string }> {
render() {
const { area } = this.props;
const { area, itemClassName } = this.props;
const left: any[] = [];
const center: any[] = [];
const right: any[] = [];
@ -29,12 +29,17 @@ class Contents extends Component<{ area: Area }> {
const index2 = b.config?.index || 0;
return index1 === index2 ? 0 : (index1 > index2 ? 1 : -1);
}).forEach(item => {
const content = (
<div className={itemClassName || ''}>
{item.content}
</div>
);
if (item.align === 'center') {
center.push(item.content);
center.push(content);
} else if (item.align === 'left') {
left.push(item.content);
left.push(content);
} else {
right.push(item.content);
right.push(content);
}
});
return (

14
packages/editor-skeleton/src/layouts/workbench.less
View File

@ -185,12 +185,12 @@ body {
display: flex;
margin-bottom: 2px;
padding: 8px;
.lc-top-area-left{}
.lc-top-area-center{
flex: 1;
display: flex;
justify-content: flex-end;
margin-right: 8px;
justify-content: center;
margin: 0 8px;
}
.lc-top-area-right{
display: flex;
@ -268,6 +268,13 @@ body {
.lc-title{
padding: 12px;
flex-direction: column;
width: 46px;
height: 46px;
svg {
fill: var(--color-icon-normal,rgba(31,56,88,.4));
}
&.has-tip{
cursor: pointer;
}
@ -324,6 +331,7 @@ body {
flex: 1;
display: flex;
flex-direction: column;
z-index: 10;
.lc-toolbar {
height: var(--toolbar-height);
background-color: var(--color-pane-background);

6
packages/editor-skeleton/src/layouts/workbench.tsx
View File

@ -13,16 +13,16 @@ import RightArea from './right-area';
import './workbench.less';
@observer
export class Workbench extends Component<{ skeleton: Skeleton, className?: string }> {
export class Workbench extends Component<{ skeleton: Skeleton, className?: string, topAreaItemClassName?: string }> {
shouldComponentUpdate() {
return false;
}
render() {
const { skeleton, className } = this.props;
const { skeleton, className, topAreaItemClassName } = this.props;
return (
<div className={classNames('lc-workbench', className)}>
<TopArea area={skeleton.topArea} />
<TopArea area={skeleton.topArea} itemClassName={topAreaItemClassName} />
<div className="lc-workbench-body">
<LeftArea area={skeleton.leftArea} />
<LeftFloatPane area={skeleton.leftFloatArea} />

41
packages/editor-skeleton/src/transducers/addon-combine.ts
View File

@ -183,8 +183,12 @@ export default function(metadata: TransformedComponentMetadata): TransformedComp
items: [
{
name: '___condition',
title: { type: 'i18n', 'zh-CN': '条件显示', 'en-US': 'Condition' },
setter: 'ExpressionSetter',
title: { type: 'i18n', 'zh-CN': '是否渲染', 'en-US': 'Condition' },
setter: [{
componentName: 'BoolSetter',
}, {
componentName: 'VariableSetter'
}],
},
{
name: '#loop',
@ -193,27 +197,14 @@ export default function(metadata: TransformedComponentMetadata): TransformedComp
{
name: '___loop',
title: { type: 'i18n', 'zh-CN': '循环数据', 'en-US': 'Loop Data' },
setter: {
componentName: 'MixinSetter',
setter: [{
componentName: 'JsonSetter',
props: {
// TODO:
setters: [
{
componentName: 'JSONSetter',
props: {
mode: 'popup',
placeholder: { type: 'i18n', 'zh-CN': '编辑数据', 'en-US': 'Edit Data' },
},
},
{
componentName: 'ExpressionSetter',
props: {
placeholder: { type: 'i18n', 'zh-CN': '绑定数据', 'en-US': 'Bind Data' },
},
},
],
label: { type: 'i18n', 'zh-CN': '编辑数据', 'en-US': 'Edit Data'},
},
},
}, {
componentName: 'VariableSetter'
}],
},
{
name: '___loopArgs.0',
@ -237,8 +228,12 @@ export default function(metadata: TransformedComponentMetadata): TransformedComp
},
{
name: 'key',
title: 'Key',
setter: 'ExpressionSetter',
title: '循环 Key',
setter: [{
componentName: 'StringSetter',
}, {
componentName: 'VariableSetter'
}],
},
],
},

2
packages/plugin-outline-pane/src/views/tree-title.tsx
View File

@ -126,7 +126,7 @@ export default class TreeTitle extends Component<{
)}
</div>
{isCNode && isNodeParent && <HideBtn treeNode={treeNode} />}
{isCNode && isNodeParent && <LockBtn treeNode={treeNode} />}
{/*isCNode && isNodeParent && <LockBtn treeNode={treeNode} />*/}
</div>
);
}

5
packages/react-renderer/src/engine/base.jsx
View File

@ -228,6 +228,11 @@ export default class BaseEngine extends PureComponent {
let Comp = components[schema.componentName] || Div;
console.info('node schema', schema, engine.props);
if (schema.hidden) {
return null;
}
if (schema.loop !== undefined) {
return this.__createLoopVirtualDom(
{

1
packages/react-simulator-renderer/package.json
View File

@ -21,6 +21,7 @@
"@recore/obx-react": "^1.0.7",
"classnames": "^2.2.6",
"react": "^16",
"@ali/vu-css-style": "^1.0.2",
"react-dom": "^16.7.0"
},
"devDependencies": {

30
packages/react-simulator-renderer/src/renderer-view.tsx
View File

@ -1,9 +1,11 @@
import LowCodeRenderer from '@ali/lowcode-react-renderer';
import { isObject } from 'lodash';
import { ReactInstance, Fragment, Component, createElement } from 'react';
import { observer } from '@recore/obx-react';
import { SimulatorRenderer } from './renderer';
import { host } from './host';
import './renderer.less';
import { toCss } from '@ali/vu-css-style';
// patch cloneElement avoid lost keyProps
const originCloneElement = window.React.cloneElement;
@ -84,6 +86,10 @@ class Renderer extends Component<{ renderer: SimulatorRenderer }> {
const { __id, __desingMode, ...viewProps } = props;
viewProps.componentId = __id;
viewProps._leaf = host.document.getNode(__id);
// FIXME: 此处未来使用propsReducer方式处理
this.createNodeStyleSheet(viewProps);
return createElement(
Component,
viewProps,
@ -99,4 +105,28 @@ class Renderer extends Component<{ renderer: SimulatorRenderer }> {
/>
);
}
createNodeStyleSheet(props: any) {
if (props && props.fieldId) {
let styleProp = props.__style__;
if (isObject(styleProp)) {
styleProp = toCss(styleProp);
}
if (typeof styleProp === 'string') {
const s = document.createElement('style');
const cssId = '_style_pesudo_' + props.fieldId;
const cssClass = '_css_pesudo_' + props.fieldId;
props.className = cssClass;
s.setAttribute('type', 'text/css');
s.setAttribute('id', cssId);
document.getElementsByTagName('head')[0].appendChild(s);
s.appendChild(document.createTextNode(styleProp.replace(/:root/g, '.' + cssClass)));
return s;
}
}
}
}

1
packages/vision-preset/src/index.ts
View File

@ -44,6 +44,7 @@ function init(container?: Element) {
createElement(Workbench, {
skeleton,
className: 'engine-main',
topAreaItemClassName: 'engine-actionitem',
}),
container,
);