query design

This commit is contained in:
Jan Prochazka
2020-12-30 10:05:34 +01:00
parent 2f6c749941
commit 0fdf333c0b
3 changed files with 38 additions and 13 deletions

View File

@@ -21,6 +21,11 @@ const Canvas = styled.div`
position: relative;
`;
const EmptyInfo = styled.div`
margin: 50px;
font-size: 20px;
`;
export default function Designer({ value, onChange, conid, database }) {
const { tables, references } = value || {};
const theme = useTheme();
@@ -46,7 +51,7 @@ export default function Designer({ value, onChange, conid, database }) {
onChange((current) => {
const foreignKeys = _.compact([
...(json.foreignKeys || []).map((fk) => {
const tables = (current.tables || []).filter(
const tables = ((current || {}).tables || []).filter(
(tbl) => fk.refTableName == tbl.pureName && fk.refSchemaName == tbl.schemaName
);
if (tables.length == 1)
@@ -58,7 +63,7 @@ export default function Designer({ value, onChange, conid, database }) {
return null;
}),
..._.flatten(
(current.tables || []).map((tbl) =>
((current || {}).tables || []).map((tbl) =>
(tbl.foreignKeys || []).map((fk) => {
if (fk.refTableName == json.pureName && fk.refSchemaName == json.schemaName) {
return {
@@ -75,11 +80,11 @@ export default function Designer({ value, onChange, conid, database }) {
return {
...current,
tables: [...(current.tables || []), json],
tables: [...((current || {}).tables || []), json],
references:
foreignKeys.length == 1
? [
...(current.references || []),
...((current || {}).references || []),
{
designerId: uuidv1(),
sourceId: foreignKeys[0].sourceId,
@@ -91,7 +96,7 @@ export default function Designer({ value, onChange, conid, database }) {
})),
},
]
: current.references,
: (current || {}).references,
};
});
};
@@ -283,6 +288,7 @@ export default function Designer({ value, onChange, conid, database }) {
return (
<Wrapper theme={theme}>
{(tables || []).length == 0 && <EmptyInfo>Drag &amp; drop tables or views from left panel list here</EmptyInfo>}
<Canvas onDragOver={(e) => e.preventDefault()} onDrop={handleDrop} ref={wrapperRef}>
{(references || []).map((ref) => (
<DesignerReference

View File

@@ -23,7 +23,11 @@ const Header = styled.div`
font-weight: bold;
text-align: center;
padding: 2px;
background: ${(props) => props.theme.designtable_background_blue[2]};
background: ${(props) =>
// @ts-ignore
props.objectTypeField == 'views'
? props.theme.designtable_background_magenta[2]
: props.theme.designtable_background_blue[2]};
border-bottom: 1px solid ${(props) => props.theme.border};
cursor: pointer;
display: flex;
@@ -140,7 +144,7 @@ export default function DesignerTable({
setChangeToken,
designer,
}) {
const { pureName, columns, left, top, designerId, alias } = table;
const { pureName, columns, left, top, designerId, alias, objectTypeField } = table;
const [movingPosition, setMovingPosition] = React.useState(null);
const movingPositionRef = React.useRef(null);
const theme = useTheme();
@@ -287,7 +291,7 @@ export default function DesignerTable({
addReference={
foreignKey
? () => {
onAddReferenceByColumn(designerId, foreignKey);
onAddReferenceByColumn(designerId, foreignKey);
}
: null
}
@@ -305,7 +309,13 @@ export default function DesignerTable({
onMouseDown={() => onBringToFront(table)}
ref={(dom) => dispatchDomColumn('', dom)}
>
<Header onMouseDown={headerMouseDown} theme={theme} onContextMenu={handleHeaderContextMenu}>
<Header
onMouseDown={headerMouseDown}
theme={theme}
onContextMenu={handleHeaderContextMenu}
// @ts-ignore
objectTypeField={objectTypeField}
>
<HeaderLabel>{alias || pureName}</HeaderLabel>
<CloseWrapper onClick={() => onRemoveTable(table)} theme={theme}>
<FontIcon icon="icon close" />