端到端 设计器虚线框交互优化&数据属性根据配置需要展示问题&建模管理端到端图标缺少问题
@ -67,6 +67,7 @@ public class GraphRender {
|
|||||||
public void handleShapeNodeRender(double[][] position) {
|
public void handleShapeNodeRender(double[][] position) {
|
||||||
JSONObject defineJsonObj = JSONObject.parseObject(this.baseModel.getDefinition());
|
JSONObject defineJsonObj = JSONObject.parseObject(this.baseModel.getDefinition());
|
||||||
JSONObject elements = defineJsonObj.getJSONObject("elements");
|
JSONObject elements = defineJsonObj.getJSONObject("elements");
|
||||||
|
List<PALMethodAttributeModel> attributes = CoeDesignerShapeAPIManager.getInstance().getValidAndUseAttributeModels(repositoryModel.getWsId(), SubProcessConst.SUB_PROCESS_METHOD_ID, "subProcess", SubProcessConst.SUB_PROCESS_METHOD_ID);
|
||||||
for (int i = 0; i < nodeList.size(); i++) {
|
for (int i = 0; i < nodeList.size(); i++) {
|
||||||
PALRepositoryModel relationRepositoryModel = PALRepositoryCache.getCache().get(nodeList.get(i).getId());
|
PALRepositoryModel relationRepositoryModel = PALRepositoryCache.getCache().get(nodeList.get(i).getId());
|
||||||
JSONObject subProcessNode = ShapeUtil.getProcessShapeDefinition(SubProcessConst.SUB_PROCESS_METHOD_ID, "子流程");
|
JSONObject subProcessNode = ShapeUtil.getProcessShapeDefinition(SubProcessConst.SUB_PROCESS_METHOD_ID, "子流程");
|
||||||
@ -94,7 +95,6 @@ public class GraphRender {
|
|||||||
JSONObject dataAttr = (JSONObject) o;
|
JSONObject dataAttr = (JSONObject) o;
|
||||||
if (dataAttr.containsKey("attributesJsonArray")){
|
if (dataAttr.containsKey("attributesJsonArray")){
|
||||||
JSONArray attributesJsonArr = dataAttr.getJSONArray("attributesJsonArray");
|
JSONArray attributesJsonArr = dataAttr.getJSONArray("attributesJsonArray");
|
||||||
List<PALMethodAttributeModel> attributes = PALMethodCache.getPALMethodModelById(SubProcessConst.SUB_PROCESS_METHOD_ID).getAttributes();
|
|
||||||
for (PALMethodAttributeModel attribute : attributes) {
|
for (PALMethodAttributeModel attribute : attributes) {
|
||||||
JSONObject data = new JSONObject();
|
JSONObject data = new JSONObject();
|
||||||
data.put("isRequired", attribute.getIsRequired());
|
data.put("isRequired", attribute.getIsRequired());
|
||||||
|
|||||||
|
After Width: | Height: | Size: 46 KiB |
|
After Width: | Height: | Size: 249 B |
|
After Width: | Height: | Size: 42 KiB |
|
After Width: | Height: | Size: 42 KiB |
|
After Width: | Height: | Size: 43 KiB |
|
After Width: | Height: | Size: 43 KiB |
|
After Width: | Height: | Size: 43 KiB |
|
After Width: | Height: | Size: 42 KiB |
|
After Width: | Height: | Size: 1.8 KiB |
|
After Width: | Height: | Size: 570 B |
|
After Width: | Height: | Size: 242 B |
|
After Width: | Height: | Size: 256 B |
|
After Width: | Height: | Size: 178 B |
|
After Width: | Height: | Size: 156 B |
|
After Width: | Height: | Size: 42 KiB |
|
After Width: | Height: | Size: 41 KiB |
|
After Width: | Height: | Size: 42 KiB |
|
After Width: | Height: | Size: 42 KiB |
|
After Width: | Height: | Size: 41 KiB |
|
After Width: | Height: | Size: 4.7 KiB |
|
After Width: | Height: | Size: 5.3 KiB |
|
After Width: | Height: | Size: 4.9 KiB |
|
After Width: | Height: | Size: 4.8 KiB |
|
After Width: | Height: | Size: 42 KiB |
|
After Width: | Height: | Size: 42 KiB |
|
After Width: | Height: | Size: 46 KiB |
|
After Width: | Height: | Size: 42 KiB |
|
After Width: | Height: | Size: 41 KiB |
|
After Width: | Height: | Size: 42 KiB |
|
After Width: | Height: | Size: 43 KiB |
|
After Width: | Height: | Size: 4.5 KiB |
|
After Width: | Height: | Size: 42 KiB |
|
After Width: | Height: | Size: 3.1 KiB |
|
After Width: | Height: | Size: 42 KiB |
|
After Width: | Height: | Size: 42 KiB |
|
After Width: | Height: | Size: 41 KiB |
|
After Width: | Height: | Size: 264 B |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 156 B |
|
After Width: | Height: | Size: 178 B |
|
After Width: | Height: | Size: 44 KiB |
@ -2849,6 +2849,13 @@ function changeArributeByShape() {
|
|||||||
} else {
|
} else {
|
||||||
// 属性弹出层显示的内容
|
// 属性弹出层显示的内容
|
||||||
var shape = Utils.getSelected()[0];
|
var shape = Utils.getSelected()[0];
|
||||||
|
if (methodId == 'process.subprocess'){ // 端到端建模 虚线框被选中的话 优先展示虚线框数据属性
|
||||||
|
let selectShapes = Utils.getSelected();
|
||||||
|
let index = selectShapes.findIndex(shape => shape.elementType == 'SCOPE_NODE');
|
||||||
|
if (index != -1){
|
||||||
|
shape = Utils.getSelected()[index];
|
||||||
|
}
|
||||||
|
}
|
||||||
if (shape.name === "linker") {
|
if (shape.name === "linker") {
|
||||||
$(".clearfix").hide();
|
$(".clearfix").hide();
|
||||||
} else {
|
} else {
|
||||||
|
|||||||
@ -371,6 +371,8 @@ var Designer = {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
b.attr("class", "shape_box");
|
b.attr("class", "shape_box");
|
||||||
|
Designer.events.push("created", g);
|
||||||
|
Model.add(g);
|
||||||
if (methodId == "process.subprocess") {
|
if (methodId == "process.subprocess") {
|
||||||
// 如果当前拖拽到画布的图形是子流程 则渲染节点展开图标
|
// 如果当前拖拽到画布的图形是子流程 则渲染节点展开图标
|
||||||
if (g.name == 'subProcess'){
|
if (g.name == 'subProcess'){
|
||||||
@ -386,8 +388,6 @@ var Designer = {
|
|||||||
window.subProcess.addScopeShapeInnerEles(scopeShapeKey, g.id);
|
window.subProcess.addScopeShapeInnerEles(scopeShapeKey, g.id);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
Designer.events.push("created", g);
|
|
||||||
Model.add(g);
|
|
||||||
var S = Utils.getShapeContext(g.id);
|
var S = Utils.getShapeContext(g.id);
|
||||||
var Q = b.position();
|
var Q = b.position();
|
||||||
var K = 7;
|
var K = 7;
|
||||||
@ -1900,23 +1900,8 @@ var Designer = {
|
|||||||
var k = Utils.getSelectedIds();
|
var k = Utils.getSelectedIds();
|
||||||
Utils.mergeArray(e, k)
|
Utils.mergeArray(e, k)
|
||||||
}
|
}
|
||||||
let flag = false;
|
|
||||||
if (methodId == "process.subprocess" && e.length > 0){
|
|
||||||
let scopeIndex = e.findIndex(shapeId => Model.getShapeById(shapeId).elementType == "SCOPE_NODE");
|
|
||||||
let innerNodeIndex = e.findIndex(shapeId => Model.getShapeById(shapeId).elementType == "INNER_NODE");
|
|
||||||
let innerLinkerIndex = e.findIndex(shapeId => Model.getShapeById(shapeId).elementType == "INNER_LINKER");
|
|
||||||
let outerNodeIndex = e.findIndex(shapeId => Model.getShapeById(shapeId).elementType == "OUTER_NODE");
|
|
||||||
let outerLinkerIndex = e.findIndex(shapeId => Model.getShapeById(shapeId).elementType == "OUTER_LINKER");
|
|
||||||
// 选中的元素中 同时出现范围框或者其内部元素以及外部元素
|
|
||||||
if ((scopeIndex != -1 || innerNodeIndex != -1 || innerLinkerIndex != -1) && (outerNodeIndex != -1 || outerLinkerIndex != -1)){
|
|
||||||
flag = true;
|
|
||||||
$.simpleAlert("范围框以及其内部元素不能与范围框外部元素同时被选中!");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
Utils.unselect();
|
Utils.unselect();
|
||||||
if (!flag){
|
Utils.selectShape(e);
|
||||||
Utils.selectShape(e);
|
|
||||||
}
|
|
||||||
b.remove()
|
b.remove()
|
||||||
}
|
}
|
||||||
Designer.op.resetState();
|
Designer.op.resetState();
|
||||||
|
|||||||
@ -47,7 +47,7 @@ class SubProcess {
|
|||||||
if (shape.name == 'subProcess' || shape.name == 'scopeLimitation') {
|
if (shape.name == 'subProcess' || shape.name == 'scopeLimitation') {
|
||||||
let expandIcon = "<span id='icon_"+shapeId+"' class='iconfont icon-lianjietiaozhuan' style='position: absolute;cursor: pointer;'></span>";
|
let expandIcon = "<span id='icon_"+shapeId+"' class='iconfont icon-lianjietiaozhuan' style='position: absolute;cursor: pointer;'></span>";
|
||||||
$('#'+shapeId).append(expandIcon);
|
$('#'+shapeId).append(expandIcon);
|
||||||
$('#icon_'+shapeId).on('click', '', {uuid: shape.extendAttr.id, sid: this.sid}, this.subProcessNodeLink);
|
$('#icon_'+shapeId).on('click', '', {shape: shape, sid: this.sid}, this.subProcessNodeLink);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -59,19 +59,21 @@ class SubProcess {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
let shapeId = ele.id;
|
let shapeId = ele.id;
|
||||||
let expandIcon = "<span id='icon_"+shapeId+"' class='iconfont icon-zhankaishousuo' style='position: absolute;cursor: pointer;'></span>";
|
let shape = this.Model.getShapeById(shapeId);
|
||||||
|
let expandIcon = "<span id='icon_"+shapeId+"' class='iconfont icon-lianjietiaozhuan' style='position: absolute;cursor: pointer;'></span>";
|
||||||
$('#'+shapeId).append(expandIcon);
|
$('#'+shapeId).append(expandIcon);
|
||||||
$('#icon_'+shapeId).on('click', '', {shapeId: shapeId, Model: this.Model, repositoryId: this.repositoryId, sid: this.sid}, this.shapeExpand);
|
$('#icon_'+shapeId).on('click', '', {shape: shape, sid: this.sid}, this.subProcessNodeLink);
|
||||||
}
|
}
|
||||||
|
|
||||||
// 范围选择框的事件绑定处理
|
// 范围选择框的事件绑定处理
|
||||||
handleScopeShapeEvent(){
|
handleScopeShapeEvent(){
|
||||||
let c = $("#designer_canvas");
|
let c = $("#designer_canvas");
|
||||||
c.off("mousemove").on("mousemove",function (a) {
|
c.off("mousemove.scope").on("mousemove.scope",function (a) {
|
||||||
let b = Utils.getRelativePos(a.pageX, a.pageY, c); // 实时获取鼠标移动的坐标
|
let b = Utils.getRelativePos(a.pageX, a.pageY, c); // 实时获取鼠标移动的坐标
|
||||||
let j = Utils.getShapeByPosition(b.x, b.y); // 根据鼠标当前移动的位置获取当前图形 如果有的话
|
let j = Utils.getShapeByPosition(b.x, b.y); // 根据鼠标当前移动的位置获取当前图形 如果有的话
|
||||||
// console.log("当前图形", j);
|
// console.log("当前图形", j);
|
||||||
if (j != null) {
|
if (j != null) {
|
||||||
|
let tempSelectArr = [];
|
||||||
if (j.shape.name == 'scopeLimitation'){
|
if (j.shape.name == 'scopeLimitation'){
|
||||||
let range = {
|
let range = {
|
||||||
x: j.shape.props.x,
|
x: j.shape.props.x,
|
||||||
@ -83,17 +85,25 @@ class SubProcess {
|
|||||||
e = e.filter(id => Model.getShapeById(id).elementType !== "OUTER_NODE").filter(id => Model.getShapeById(id).elementType !== "OUTER_LINKER"); // 因为范围框人工改变大小后 可能包含外部元素
|
e = e.filter(id => Model.getShapeById(id).elementType !== "OUTER_NODE").filter(id => Model.getShapeById(id).elementType !== "OUTER_LINKER"); // 因为范围框人工改变大小后 可能包含外部元素
|
||||||
// 将当前范围选择框元素以及范围内的元素 存储到subProcess中 方便后续 范围框内的元素移动时做范围框限制
|
// 将当前范围选择框元素以及范围内的元素 存储到subProcess中 方便后续 范围框内的元素移动时做范围框限制
|
||||||
window.subProcess.scopeEle[j.shape.id] = e;
|
window.subProcess.scopeEle[j.shape.id] = e;
|
||||||
$('#'+j.shape.id).off("mousedown").on("mousedown", function (f) {
|
// $('#'+j.shape.id).off("mousedown.scope").on("mousedown.scope", function (f) {
|
||||||
Utils.unselect();
|
// Utils.unselect();
|
||||||
Utils.selectShape(e);
|
// if ((range.x < b.x && b.x < range.x + 20 && range.y < b.y && b.y < range.y + 20)
|
||||||
});
|
// || (range.x + range.w - 20 < b.x && b.x < range.x + range.w && range.y < b.y && b.y < range.y + 20)
|
||||||
}else if (j.shape.elementType == 'INNER_NODE') {
|
// || (range.x < b.x && b.x < range.x + 20 && range.y + range.h - 20 < b.y && b.y < range.y + range.h)
|
||||||
|
// || (range.x + range.w - 20 < b.x && b.x < range.x + range.w && range.y + range.h - 20 < b.y && b.y < range.y + range.h)){
|
||||||
|
//
|
||||||
|
// Utils.selectShape(e);
|
||||||
|
// Designer.op.shapeDraggable();
|
||||||
|
//
|
||||||
|
// }
|
||||||
|
// });
|
||||||
|
tempSelectArr = e;
|
||||||
|
}else if (j.shape.elementType == 'INNER_NODE' || j.shape.elementType == 'INNER_LINKER') {
|
||||||
// console.log('范围标注框的图形是否存了下来', window.subProcess.scopeEle);
|
// console.log('范围标注框的图形是否存了下来', window.subProcess.scopeEle);
|
||||||
let scopeEle = window.subProcess.scopeEle;
|
let scopeEle = window.subProcess.scopeEle;
|
||||||
for (const scopeShapeId in scopeEle) {
|
for (const scopeShapeId in scopeEle) {
|
||||||
let inRangeEles = scopeEle[scopeShapeId];
|
let inRangeEles = scopeEle[scopeShapeId];
|
||||||
if (inRangeEles.indexOf(j.shape.id) != -1){ // 当前鼠标所在位置为范围选择框范围内
|
if (inRangeEles.indexOf(j.shape.id) != -1){ // 当前鼠标所在位置为范围选择框范围内
|
||||||
Utils.unselect();
|
|
||||||
let currentScopeEle = Model.getShapeById(scopeShapeId); // 获取当前范围选择框
|
let currentScopeEle = Model.getShapeById(scopeShapeId); // 获取当前范围选择框
|
||||||
let bound = {
|
let bound = {
|
||||||
x: currentScopeEle.props.x,
|
x: currentScopeEle.props.x,
|
||||||
@ -110,12 +120,25 @@ class SubProcess {
|
|||||||
|
|
||||||
window.subProcess.scopeRang = rang;
|
window.subProcess.scopeRang = rang;
|
||||||
window.subProcess.movingEle = Model.getShapeById(j.shape.id);
|
window.subProcess.movingEle = Model.getShapeById(j.shape.id);
|
||||||
|
// Utils.selectShape(j.shape.id);
|
||||||
|
tempSelectArr = [];
|
||||||
|
tempSelectArr.push(j.shape.id);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}else {
|
}else {
|
||||||
window.subProcess.movingEle = null;
|
window.subProcess.movingEle = null;
|
||||||
window.subProcess.scopeRang = null;
|
window.subProcess.scopeRang = null;
|
||||||
}
|
}
|
||||||
|
if (tempSelectArr.length){
|
||||||
|
$('#'+j.shape.id).off("mousedown.scope").on("mousedown.scope", function (f) {
|
||||||
|
Utils.unselect();
|
||||||
|
Utils.selectShape(tempSelectArr);
|
||||||
|
|
||||||
|
$(document).bind("mouseup.select",function () {
|
||||||
|
tempSelectArr = [];
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
}else {
|
}else {
|
||||||
window.subProcess.movingEle = null;
|
window.subProcess.movingEle = null;
|
||||||
window.subProcess.scopeRang = null;
|
window.subProcess.scopeRang = null;
|
||||||
@ -478,7 +501,12 @@ class SubProcess {
|
|||||||
|
|
||||||
subProcessNodeLink(event) {
|
subProcessNodeLink(event) {
|
||||||
let param = event.data;
|
let param = event.data;
|
||||||
let url="./w?uuid=" + param.uuid +"&teamId=" + teamId
|
let shape = param.shape;
|
||||||
|
if (shape.extendAttr == undefined){
|
||||||
|
$.simpleAlert('请先绑定子流程模型,在进行跳转操作');
|
||||||
|
}
|
||||||
|
let uuid = shape.extendAttr.id;
|
||||||
|
let url="./w?uuid=" + uuid +"&teamId=" + teamId
|
||||||
+ "&cmd=com.actionsoft.apps.coe.pal_pl_repository_designer&sid=" + encodeURIComponent($('#sid').val());
|
+ "&cmd=com.actionsoft.apps.coe.pal_pl_repository_designer&sid=" + encodeURIComponent($('#sid').val());
|
||||||
window.open(url);
|
window.open(url);
|
||||||
}
|
}
|
||||||
|
|||||||