top表格收缩

This commit is contained in:
clay 2021-07-26 14:27:37 +08:00
parent bdfb5744c3
commit c6693dae67
9 changed files with 66 additions and 122 deletions

View File

@ -1,3 +1,5 @@
import utils from '../utils'
/**
* @author: clay
* @data: 2021/5/14 23:20
@ -58,7 +60,7 @@ export default {
if (nodes) {
nodes.forEach((node) => {
const model = node.getModel();
if (model.attrs.length < 9) {
if (model.column.length < 9) {
return;
}
const idx = model.startIndex || 0;
@ -71,8 +73,8 @@ export default {
if (startX > 0) {
startX = 0;
}
if (startIndex > model.attrs.length - 1) {
startIndex = model.attrs.length - 1;
if (startIndex > model.column.length - 1) {
startIndex = model.column.length - 1;
}
graph.update(node, {
startIndex,
@ -167,7 +169,7 @@ export default {
});
vm.selectedNodeParams = {
label: clickNodeModel.label || "",
attrs:clickNodeModel.attrs,
column:clickNodeModel.column,
appConfig: { ...nodeAppConfig, ...clickNodeModel.appConfig }
};
}
@ -184,8 +186,8 @@ export default {
vm.selectedEdgeParams = {
label: clickEdgeModel.label || "",
relationalItem: clickEdgeModel.relationalItem,
sourceAttrs:clickEdgeModel.sourceAttrs,
targetAttrs:clickEdgeModel.targetAttrs,
sourceColumn:clickEdgeModel.sourceColumn,
targetColumn:clickEdgeModel.targetColumn,
appConfig: { ...edgeAppConfig, ...clickEdgeModel.appConfig }
};
}
@ -204,13 +206,16 @@ export default {
graph.updateItem(item, {
collapsed: true,
size: [300, 50],
height:44,
});
setTimeout(() => graph.layout(), 100);
} else if (shape.get("name") === "expand") {
graph.updateItem(item, {
let updateGraph = graph.updateItem(item, {
collapsed: false,
size: [300, 500],
height:316,
});
// utils.anchor.update({height:100,}, graph)
setTimeout(() => graph.layout(), 100);
}else {
// eslint-disable-next-line no-unused-vars

View File

@ -99,7 +99,7 @@ export default {
id: utils.generateUUID(),
// 起始节点
source: sourceNodeModel.id,
sourceAttrs:sourceNodeModel.attrs,
sourceColumn:sourceNodeModel.attrs,
sourceAnchor: sourceAnchor ? sourceAnchor.anchorIndex : "",
// 终止节点/位置
relational: relational,
@ -160,7 +160,7 @@ export default {
target: targetNodeModel.id,
relationalItem:relationalItem,
targetAnchor: targetAnchor ? targetAnchor.anchorIndex : "",
targetAttrs: targetNodeModel.attrs,
targetColumn: targetNodeModel.attrs,
});
// ************** 记录historyData的逻辑 start **************

View File

@ -33,13 +33,13 @@ export default {
};
const {
attrs = [],
column = [],
startIndex = 0,
selectedIndex,
collapsed,
icon,
} = cfg;
const list = attrs;
const list = column;
const afterList = list.slice(
Math.floor(startIndex),
Math.floor(startIndex + itemCount - 1)
@ -212,42 +212,40 @@ export default {
name: `item-${Math.floor(startIndex) + i}-content`,
draggable: true,
});
if (!cfg.hideDot) {
// utils.anchor.erDrawLeft(group, label, 0, i * itemHeight + offsetY)
// utils.anchor.erDrawLeft(group,label,width,i * itemHeight + offsetY)
// listContainer.addShape("marker", {
// attrs: {
// x: 0,
// y: i * itemHeight + offsetY,
// r: 3,
// stroke: boxStyle.stroke,
// fill: "white",
// radius: 2,
// lineWidth: 1,
// cursor: "crosshair",
// },
//
// name: 'marker-shape'
// });
// listContainer.addShape("marker", {
// attrs: {
// x: width,
// y: i * itemHeight + offsetY,
// r: 3,
// stroke: boxStyle.stroke,
// fill: "white",
// radius: 2,
// lineWidth: 1,
// cursor: "crosshair",
//
//
// },
// name: 'marker-shape'
// });
}
//未来设置字段之间有锚点
// if (!cfg.hideDot) {
// utils.anchor.erDrawLeft(group, label, 0, i * itemHeight + offsetY)
// utils.anchor.erDrawLeft(group,label,width,i * itemHeight + offsetY)
// listContainer.addShape("marker", {
// attrs: {
// x: 0,
// y: i * itemHeight + offsetY,
// r: 3,
// stroke: boxStyle.stroke,
// fill: "white",
// radius: 2,
// lineWidth: 1,
// cursor: "crosshair",
// },
//
// name: 'marker-shape'
// });
// listContainer.addShape("marker", {
// attrs: {
// x: width,
// y: i * itemHeight + offsetY,
// r: 3,
// stroke: boxStyle.stroke,
// fill: "white",
// radius: 2,
// lineWidth: 1,
// cursor: "crosshair",
//
//
// },
// name: 'marker-shape'
// });
// }
listContainer.addShape("text", {
attrs: {

View File

@ -139,7 +139,7 @@
<div class="input-select">
<el-select v-model="selectedEdgeParams.appConfig.tableComment" @change="tableCommentChang" size="mini">
<el-option
v-for="(item ,index) in selectedEdgeParams.sourceAttrs"
v-for="(item ,index) in selectedEdgeParams.sourceColumn"
:key="index"
:label="item.columnName+':'+item.columnComment"
:value="item.columnName"
@ -152,7 +152,7 @@
<div class="input-select">
<el-select v-model="selectedEdgeParams.appConfig.relComment" @change="relCommentChange" size="mini">
<el-option
v-for="(item ,index) in selectedEdgeParams.targetAttrs"
v-for="(item ,index) in selectedEdgeParams.targetColumn"
:key="index"
:label="item.columnName+':'+item.columnName"
:value="item.columnName"
@ -1196,7 +1196,7 @@ export default {
//
if (starts){
let droppoint = graph.getPointByClient(clientX, clientY)
let attrs = []
let column = []
for (let i = 0; i < nodeType.topSearchColumnList.length; i++) {
let item = nodeType.topSearchColumnList[i]
if (item.isUse === 1) {
@ -1205,7 +1205,7 @@ export default {
item.ucType = null
item.type = 1
item.ucMock = null
attrs.push(item)
column.push(item)
}
}
@ -1221,8 +1221,8 @@ export default {
tableId: nodeType.id,
table: nodeType.tableName,
type: 'dice-er-box',
attrs: attrs,
size: [55, 55],
column: column,
size: [300, 500],
width: 250,
height: 316,
anchorPoints: [

View File

@ -1,60 +0,0 @@
/**
* @author: clay
* @data: 2019/08/15
* @description: draw anchor
*/
import theme from '../../theme'
export default function(cfg, group) {
const themeStyle = theme.defaultStyle // todo...先使用默认主题,后期可能增加其它风格的主体
let { anchorPoints, width, height, id } = cfg
if (anchorPoints && anchorPoints.length) {
for (let i = 0, len = anchorPoints.length; i < len; i++) {
let [x, y] = anchorPoints[i]
// 计算Marker中心点坐标
let originX = -width / 2
let originY = -height / 2
let anchorX = x * width + originX
let anchorY = y * height + originY
// 添加锚点背景
let anchorBgShape = group.addShape('marker', {
id: id + '_anchor_bg_' + i,
attrs: {
name: 'anchorBg',
x: anchorX,
y: anchorY,
// 锚点默认样式
...themeStyle.anchorBgStyle.default
},
draggable: false,
name: 'markerBg-shape'
})
// 添加锚点Marker形状
// eslint-disable-next-line no-unused-vars
let anchorShape = group.addShape('marker', {
id: id + '_anchor_' + i,
attrs: {
name: 'anchor',
x: anchorX,
y: anchorY,
// 锚点默认样式
...themeStyle.anchorStyle.default
},
draggable: false,
name: 'marker-shape'
})
anchorShape.on('mouseenter', function() {
anchorBgShape.attr({
...themeStyle.anchorBgStyle.active
})
})
anchorShape.on('mouseleave', function() {
anchorBgShape.attr({
...themeStyle.anchorBgStyle.inactive
})
})
}
}
}

View File

@ -12,10 +12,8 @@ export default function(cfg, group) {
for (let i = 0, len = anchorPoints.length; i < len; i++) {
let [x, y] = anchorPoints[i]
// 计算Marker中心点坐标
let originX = -width / 2
let originY = -height / 2
let anchorX = x * width + originX+125
let anchorY = y * height + originY+158
let anchorX = x * width
let anchorY = y * height
// 添加锚点背景
let anchorBgShape = group.addShape('marker', {
id: id + '_anchor_bg_' + i,

View File

@ -4,14 +4,14 @@
* @description: anchor
*/
// import draw from './draw'
import erDrawLeft from './er-draw-left'
import setState from './set-state'
import drawMark from './draw_mark'
// import update from './update'
import update from './update'
export default {
setState,
erDrawLeft,
drawMark,
update
}

View File

@ -119,7 +119,7 @@ export default {
total:0
},
graphData: {
// "nodes":[{"id":"305bfbdd-31cc-4028-b2b1-2f504968356d","x":304.8223042174235,"y":131.0267312661499,"label":"","table":"test_table","type":"dice-er-box","attrs":[{"key":"id","type":"number(6)","comment":"id","isUse":0},{"key":"key","type":"varchar(255)","comment":"","isUse":1},{"key":"gender","type":"enum(M, F)","comment":"gender","isUse":1},{"key":"birthday","type":"date","comment":"","isUse":0},{"key":"hometown","type":"varchar(255)","comment":"","isUse":0},{"key":"country","type":"varchar(255)","comment":"","isUse":1},{"key":"nation","type":"varchar(255)","comment":"nation","isUse":1},{"key":"jobId","type":"number(3)","comment":"id","isUse":1},{"key":"phone","type":"varchar(255)","comment":"","isUse":1}],"size":[55,55],"width":250,"height":316,"anchorPoints":[[0.5,0],[1,0.5],[0.5,1],[0,0.5]],"appState":{"alert":false},"labelCfg":{"position":"bottom"},"style":{"default":{"stroke":"#CED4D9","fill":"transparent","shadowBlur":10,"shadowColor":"rgba(13, 26, 38, 0.08)","lineWidth":1,"radius":4,"strokeOpacity":0.7},"selected":{"shadowColor":"#ff240b","shadowBlur":2},"unselected":{"shadowColor":""}},"selectedIndex":null,"appConfig":{},"depth":0},{"id":"be9b52e5-9c2f-4e5c-990a-afbf19dcfeed","x":-94.51187075489108,"y":127.35469287559994,"label":"","table":"test_table","type":"dice-er-box","attrs":[{"key":"id","type":"number(6)","comment":"id","isUse":0},{"key":"key","type":"varchar(255)","comment":"","isUse":1},{"key":"gender","type":"enum(M, F)","comment":"gender","isUse":0},{"key":"birthday","type":"date","comment":"","isUse":1},{"key":"hometown","type":"varchar(255)","comment":"","isUse":1},{"key":"country","type":"varchar(255)","comment":"","isUse":0},{"key":"nation","type":"varchar(255)","comment":"nation","isUse":1},{"key":"jobId","type":"number(3)","comment":"id","isUse":1},{"key":"phone","type":"varchar(255)","comment":"","isUse":1}],"size":[55,55],"width":250,"height":316,"anchorPoints":[[0.5,0],[1,0.5],[0.5,1],[0,0.5]],"appState":{"alert":false},"labelCfg":{"position":"bottom"},"style":{"default":{"stroke":"#CED4D9","fill":"transparent","shadowBlur":10,"shadowColor":"rgba(13, 26, 38, 0.08)","lineWidth":1,"radius":4,"strokeOpacity":0.7},"selected":{"shadowColor":"#ff240b","shadowBlur":2},"unselected":{"shadowColor":""}},"selectedIndex":null,"appConfig":{},"startIndex":0,"startX":0,"depth":0}],"edges":[{"id":"8bc0249e-ee5d-4dd7-84e0-e4e32c217f2a","source":"be9b52e5-9c2f-4e5c-990a-afbf19dcfeed","sourceAttrs":[{"key":"id","type":"number(6)","comment":"id","isUse":1},{"key":"key","type":"varchar(255)","comment":"","isUse":1},{"key":"gender","type":"enum(M, F)","comment":"gender","isUse":1},{"key":"birthday","type":"date","comment":"","isUse":1},{"key":"hometown","type":"varchar(255)","comment":"","isUse":1},{"key":"country","type":"varchar(255)","comment":"","isUse":1},{"key":"nation","type":"varchar(255)","comment":"nation","isUse":1},{"key":"jobId","type":"number(3)","comment":"id","isUse":1},{"key":"phone","type":"varchar(255)","comment":"","isUse":1}],"sourceAnchor":1,"target":"305bfbdd-31cc-4028-b2b1-2f504968356d","type":"top-cubic","style":{"active":{"stroke":"rgb(95, 149, 255)","lineWidth":1},"selected":{"stroke":"rgb(95, 149, 255)","lineWidth":2,"shadowColor":"rgb(95, 149, 255)","shadowBlur":10,"text-shape":{"fontWeight":500}},"highlight":{"stroke":"rgb(95, 149, 255)","lineWidth":2,"text-shape":{"fontWeight":500}},"inactive":{"stroke":"rgb(234, 234, 234)","lineWidth":1},"disable":{"stroke":"rgb(245, 245, 245)","lineWidth":1},"edgeStyle":{"default":{"stroke":"#e2e2e2","lineWidth":3,"lineAppendWidth":10},"selected":{"shadowColor":"#626262","shadowBlur":3}},"stroke":"#A3B1BF","lineWidth":2,"strokeOpacity":0.92,"lineAppendWidth":10},"labelCfg":{"position":"center","autoRotate":false},"startPoint":{"x":155.98812924510892,"y":285.35469287559994,"anchorIndex":1},"endPoint":{"x":304.3223042174235,"y":289.0267312661499,"anchorIndex":3},"curveOffset":[-20,20],"curvePosition":[0.5,0.5],"targetAnchor":3,"targetAttrs":[{"key":"id","type":"number(6)","comment":"id","isUse":1},{"key":"key","type":"varchar(255)","comment":"","isUse":1},{"key":"gender","type":"enum(M, F)","comment":"gender","isUse":1},{"key":"birthday","type":"date","comment":"","isUse":1},{"key":"hometown","type":"varchar(255)","comment":"","isUse":1},{"key":"country","type":"varchar(255)","comment":"","isUse":1},{"key":"nation","type":"varchar(255)","comment":"nation","isUse":1},{"key":"jobId","type":"number(3)","comment":"id","isUse":1},{"key":"phone","type":"varchar(255)","comment":"","isUse":1}],"depth":0}],"combos":[]},
// "nodes":[{"id":"305bfbdd-31cc-4028-b2b1-2f504968356d","x":304.8223042174235,"y":131.0267312661499,"label":"","table":"test_table","type":"dice-er-box","attrs":[{"key":"id","type":"number(6)","comment":"id","isUse":0},{"key":"key","type":"varchar(255)","comment":"","isUse":1},{"key":"gender","type":"enum(M, F)","comment":"gender","isUse":1},{"key":"birthday","type":"date","comment":"","isUse":0},{"key":"hometown","type":"varchar(255)","comment":"","isUse":0},{"key":"country","type":"varchar(255)","comment":"","isUse":1},{"key":"nation","type":"varchar(255)","comment":"nation","isUse":1},{"key":"jobId","type":"number(3)","comment":"id","isUse":1},{"key":"phone","type":"varchar(255)","comment":"","isUse":1}],"size":[55,55],"width":250,"height":316,"anchorPoints":[[0.5,0],[1,0.5],[0.5,1],[0,0.5]],"appState":{"alert":false},"labelCfg":{"position":"bottom"},"style":{"default":{"stroke":"#CED4D9","fill":"transparent","shadowBlur":10,"shadowColor":"rgba(13, 26, 38, 0.08)","lineWidth":1,"radius":4,"strokeOpacity":0.7},"selected":{"shadowColor":"#ff240b","shadowBlur":2},"unselected":{"shadowColor":""}},"selectedIndex":null,"appConfig":{},"depth":0},{"id":"be9b52e5-9c2f-4e5c-990a-afbf19dcfeed","x":-94.51187075489108,"y":127.35469287559994,"label":"","table":"test_table","type":"dice-er-box","attrs":[{"key":"id","type":"number(6)","comment":"id","isUse":0},{"key":"key","type":"varchar(255)","comment":"","isUse":1},{"key":"gender","type":"enum(M, F)","comment":"gender","isUse":0},{"key":"birthday","type":"date","comment":"","isUse":1},{"key":"hometown","type":"varchar(255)","comment":"","isUse":1},{"key":"country","type":"varchar(255)","comment":"","isUse":0},{"key":"nation","type":"varchar(255)","comment":"nation","isUse":1},{"key":"jobId","type":"number(3)","comment":"id","isUse":1},{"key":"phone","type":"varchar(255)","comment":"","isUse":1}],"size":[55,55],"width":250,"height":316,"anchorPoints":[[0.5,0],[1,0.5],[0.5,1],[0,0.5]],"appState":{"alert":false},"labelCfg":{"position":"bottom"},"style":{"default":{"stroke":"#CED4D9","fill":"transparent","shadowBlur":10,"shadowColor":"rgba(13, 26, 38, 0.08)","lineWidth":1,"radius":4,"strokeOpacity":0.7},"selected":{"shadowColor":"#ff240b","shadowBlur":2},"unselected":{"shadowColor":""}},"selectedIndex":null,"appConfig":{},"startIndex":0,"startX":0,"depth":0}],"edges":[{"id":"8bc0249e-ee5d-4dd7-84e0-e4e32c217f2a","source":"be9b52e5-9c2f-4e5c-990a-afbf19dcfeed","sourceColumn":[{"key":"id","type":"number(6)","comment":"id","isUse":1},{"key":"key","type":"varchar(255)","comment":"","isUse":1},{"key":"gender","type":"enum(M, F)","comment":"gender","isUse":1},{"key":"birthday","type":"date","comment":"","isUse":1},{"key":"hometown","type":"varchar(255)","comment":"","isUse":1},{"key":"country","type":"varchar(255)","comment":"","isUse":1},{"key":"nation","type":"varchar(255)","comment":"nation","isUse":1},{"key":"jobId","type":"number(3)","comment":"id","isUse":1},{"key":"phone","type":"varchar(255)","comment":"","isUse":1}],"sourceAnchor":1,"target":"305bfbdd-31cc-4028-b2b1-2f504968356d","type":"top-cubic","style":{"active":{"stroke":"rgb(95, 149, 255)","lineWidth":1},"selected":{"stroke":"rgb(95, 149, 255)","lineWidth":2,"shadowColor":"rgb(95, 149, 255)","shadowBlur":10,"text-shape":{"fontWeight":500}},"highlight":{"stroke":"rgb(95, 149, 255)","lineWidth":2,"text-shape":{"fontWeight":500}},"inactive":{"stroke":"rgb(234, 234, 234)","lineWidth":1},"disable":{"stroke":"rgb(245, 245, 245)","lineWidth":1},"edgeStyle":{"default":{"stroke":"#e2e2e2","lineWidth":3,"lineAppendWidth":10},"selected":{"shadowColor":"#626262","shadowBlur":3}},"stroke":"#A3B1BF","lineWidth":2,"strokeOpacity":0.92,"lineAppendWidth":10},"labelCfg":{"position":"center","autoRotate":false},"startPoint":{"x":155.98812924510892,"y":285.35469287559994,"anchorIndex":1},"endPoint":{"x":304.3223042174235,"y":289.0267312661499,"anchorIndex":3},"curveOffset":[-20,20],"curvePosition":[0.5,0.5],"targetAnchor":3,"targetColumn":[{"key":"id","type":"number(6)","comment":"id","isUse":1},{"key":"key","type":"varchar(255)","comment":"","isUse":1},{"key":"gender","type":"enum(M, F)","comment":"gender","isUse":1},{"key":"birthday","type":"date","comment":"","isUse":1},{"key":"hometown","type":"varchar(255)","comment":"","isUse":1},{"key":"country","type":"varchar(255)","comment":"","isUse":1},{"key":"nation","type":"varchar(255)","comment":"nation","isUse":1},{"key":"jobId","type":"number(3)","comment":"id","isUse":1},{"key":"phone","type":"varchar(255)","comment":"","isUse":1}],"depth":0}],"combos":[]},
},
nodeTypeList: [
// { guid: "blue", label: "", imgSrc: require("../../assets/images/blue.svg") },

View File

@ -4,6 +4,7 @@ import com.alibaba.fastjson.JSON;
import com.alibaba.fastjson.JSONArray;
import com.alibaba.fastjson.JSONObject;
import com.ebts.common.utils.ServerResult;
import com.ebts.common.utils.StringUtils;
import com.ebts.generator.dao.QueryDao;
import com.ebts.generator.dao.RelationalMapDao;
import com.ebts.generator.dao.TopSearchTableDao;
@ -63,8 +64,10 @@ public class TopQueryServiceImpl implements TopQueryService {
sql.append(", ");
}
sql.append(column.getString("columnName"));
sql.append(" as ");
sql.append("'" + column.getString("columnComment") + "'");
if (StringUtils.isNotNull(column.getString("columnComment"))){
sql.append(" as ");
sql.append("'" + column.getString("columnComment") + "'");
}
start=true;
}
}