Skip to content

liangzhen / framework-tools-web

Go to a project
Commit f4f984df by liuyong
Options

修改画布逻辑

1 parent 035d54aa
Expand all
Inline Side-by-side
Showing with 453 additions and 222 deletions
public/drawio/eachart.json
...@@ -4,140 +4,40 @@ ...@@ -4,140 +4,40 @@
"eadata": [{ "eadata": [{
"id" : "busi-archi-chart", "id" : "busi-archi-chart",
"type" : "business-ea", "type" : "business-ea",
"title" : "业务架构", "title" : "业务架构22222222222",
"elements" : [{ "elements" : [
"name" : "长方形", {
"w" : 100, "name" : "箭头测试",
"h" : 50, "w" : 100,
"showLable" : "长方形", "h" : 50,
"styles" : "strokeWidth=2;html=1;shape=mxgraph.eachart.annotation_2;align=left;labelPosition=right;pointerEvents=1;" "showLable" : "长方形",
},{ "styles" : "strokeWidth=2;html=1;shape=mxgraph.eachart.annotation_2;align=left;labelPosition=right;pointerEvents=1;"
"name" : "矩形", },{
"w" : 50, "name" : "矩形",
"h" : 100, "w" : 50,
"showLable" : "", "h" : 100,
"styles" : "strokeWidth=2;html=1;shape=mxgraph.eachart.annotation_2;align=left;labelPosition=right;pointerEvents=1;" "showLable" : "",
},{ "styles" : "strokeWidth=2;html=1;shape=mxgraph.eachart.annotation_2;align=left;labelPosition=right;pointerEvents=1;"
"name" : "长方形", },{
"w" : 100, "name" : "长方形",
"h" : 50, "w" : 100,
"showLable" : "", "h" : 50,
"styles" : "strokeWidth=2;html=1;shape=mxgraph.eachart.annotation_2;align=left;labelPosition=right;pointerEvents=1;" "showLable" : "",
},{ "styles" : "strokeWidth=2;html=1;shape=mxgraph.eachart.annotation_2;align=left;labelPosition=right;pointerEvents=1;"
"name" : "矩形", },{
"w" : 50, "name" : "矩形",
"h" : 100, "w" : 50,
"showLable" : "", "h" : 100,
"styles" : "strokeWidth=2;html=1;shape=mxgraph.eachart.annotation_2;align=left;labelPosition=right;pointerEvents=1;" "showLable" : "",
},{ "styles" : "strokeWidth=2;html=1;shape=mxgraph.eachart.annotation_2;align=left;labelPosition=right;pointerEvents=1;"
"name" : "长方形", },{
"w" : 100, "name" : "长方形",
"h" : 50, "w" : 100,
"showLable" : "", "h" : 50,
"styles" : "strokeWidth=2;html=1;shape=mxgraph.eachart.annotation_2;align=left;labelPosition=right;pointerEvents=1;" "showLable" : "",
},{ "styles" : "strokeWidth=2;html=1;shape=mxgraph.eachart.annotation_2;align=left;labelPosition=right;pointerEvents=1;"
"name" : "矩形", }
"w" : 50, ]
"h" : 100,
"showLable" : "",
"styles" : "strokeWidth=2;html=1;shape=mxgraph.eachart.annotation_2;align=left;labelPosition=right;pointerEvents=1;"
},{
"name" : "长方形",
"w" : 100,
"h" : 50,
"showLable" : "",
"styles" : "strokeWidth=2;html=1;shape=mxgraph.eachart.annotation_2;align=left;labelPosition=right;pointerEvents=1;"
},{
"name" : "矩形",
"w" : 50,
"h" : 100,
"showLable" : "",
"styles" : "strokeWidth=2;html=1;shape=mxgraph.eachart.annotation_2;align=left;labelPosition=right;pointerEvents=1;"
},{
"name" : "长方形",
"w" : 100,
"h" : 50,
"showLable" : "",
"styles" : "strokeWidth=2;html=1;shape=mxgraph.eachart.annotation_2;align=left;labelPosition=right;pointerEvents=1;"
},{
"name" : "矩形",
"w" : 50,
"h" : 100,
"showLable" : "",
"styles" : "strokeWidth=2;html=1;shape=mxgraph.eachart.annotation_2;align=left;labelPosition=right;pointerEvents=1;"
},{
"name" : "长方形",
"w" : 100,
"h" : 50,
"showLable" : "",
"styles" : "strokeWidth=2;html=1;shape=mxgraph.eachart.annotation_2;align=left;labelPosition=right;pointerEvents=1;"
},{
"name" : "矩形",
"w" : 50,
"h" : 100,
"showLable" : "",
"styles" : "strokeWidth=2;html=1;shape=mxgraph.eachart.annotation_2;align=left;labelPosition=right;pointerEvents=1;"
},{
"name" : "长方形",
"w" : 100,
"h" : 50,
"showLable" : "",
"styles" : "strokeWidth=2;html=1;shape=mxgraph.eachart.annotation_2;align=left;labelPosition=right;pointerEvents=1;"
},{
"name" : "矩形",
"w" : 50,
"h" : 100,
"showLable" : "",
"styles" : "strokeWidth=2;html=1;shape=mxgraph.eachart.annotation_2;align=left;labelPosition=right;pointerEvents=1;"
},{
"name" : "长方形",
"w" : 100,
"h" : 50,
"showLable" : "",
"styles" : "strokeWidth=2;html=1;shape=mxgraph.eachart.annotation_2;align=left;labelPosition=right;pointerEvents=1;"
},{
"name" : "矩形",
"w" : 50,
"h" : 100,
"showLable" : "",
"styles" : "strokeWidth=2;html=1;shape=mxgraph.eachart.annotation_2;align=left;labelPosition=right;pointerEvents=1;"
},{
"name" : "长方形",
"w" : 100,
"h" : 50,
"showLable" : "",
"styles" : "strokeWidth=2;html=1;shape=mxgraph.eachart.annotation_2;align=left;labelPosition=right;pointerEvents=1;"
},{
"name" : "矩形",
"w" : 50,
"h" : 100,
"showLable" : "",
"styles" : "strokeWidth=2;html=1;shape=mxgraph.eachart.annotation_2;align=left;labelPosition=right;pointerEvents=1;"
},{
"name" : "长方形",
"w" : 100,
"h" : 50,
"showLable" : "",
"styles" : "strokeWidth=2;html=1;shape=mxgraph.eachart.annotation_2;align=left;labelPosition=right;pointerEvents=1;"
},{
"name" : "矩形",
"w" : 50,
"h" : 100,
"showLable" : "",
"styles" : "strokeWidth=2;html=1;shape=mxgraph.eachart.annotation_2;align=left;labelPosition=right;pointerEvents=1;"
},{
"name" : "长方形",
"w" : 100,
"h" : 50,
"showLable" : "",
"styles" : "strokeWidth=2;html=1;shape=mxgraph.eachart.annotation_2;align=left;labelPosition=right;pointerEvents=1;"
},{
"name" : "矩形",
"w" : 50,
"h" : 100,
"showLable" : "",
"styles" : "strokeWidth=2;html=1;shape=mxgraph.eachart.annotation_2;align=left;labelPosition=right;pointerEvents=1;"
}]
},{ },{
"id" : "appl-archi-chart", "id" : "appl-archi-chart",
"type" : "appl-ea", "type" : "appl-ea",
......
public/drawio/extention/js/exFormat(旧).js 0 → 100644
//二次开发，自定义属性面板
//二次开发，自定义属性面板
const initAttributePanel = function(that) {
var graph = that.editorUi.editor.graph;
const cell = graph.getSelectionCell();
// const str_AES_decode = str => {
// const str2 = CryptoJS.AES.decrypt(str, 'secretkey');
// return str2.toString(CryptoJS.enc.Utf8);
// }
// var ss = that.editorUi.getSelectionState();
const objectTag = cell.value;
//元素名称--------------------------------------------------------------------------
// const labelName = graph.getLabel(graph.getSelectionCell());//获取节点名称
// const nodeName = labelName.replace(/<[^>]+>/g, '');
// var label_name_container = document.createElement('div');
// label_name_container.style.cssText = 'padding: 8px;display: flex;align-items: center;';
// const label = document.createElement('div');
// label.innerHTML = '节点名称: ';
// label_name_container.appendChild(label);
// const name = document.createElement("div");
// name.style.marginLeft = '20px';
// name.innerHTML = nodeName;
// graph.getModel().setValue(graph.getSelectionCell(), value_);//修改节点名称
// label_name_container.appendChild(name);
// that.container.appendChild(label_name_container);
const button_container = document.createElement('div');
button_container.style.cssText = 'padding: 8px;display: flex;justify-content: space-between;';
//新增属性按钮--------------------------------------------------------------------------
// const add_button = document.createElement('button');
// add_button.innerHTML = '新增属性';
// add_button.style.cssText = 'padding: 4px;text-align: center;cursor: pointer;background-color: rgb(228,228,228);color: rgb(97, 97, 97);';
// add_button.addEventListener('click', () => {
// that.addListPanel('', '');
// });
// button_container.appendChild(add_button);
//保存属性按钮--------------------------------------------------------------------------
const save_button = document.createElement('button');
save_button.innerHTML = '保存属性';
save_button.style.cssText = 'padding: 4px;text-align: center;cursor: pointer;background-color: rgb(228,228,228);color: rgb(97, 97, 97);';
let attrArray = [];
save_button.addEventListener('click', () => {
let propertyArray = [];
if(attrArray.length > 0) {
attrArray.forEach(item => {
propertyArray.push({
propertyId: Number(item.id),
propertyValue: item.value
})
})
window.parent.postMessage({ type: 'saveProperty', data: propertyArray }, '*');
}
});
button_container.appendChild(save_button);
that.container.appendChild(button_container);
console.log(cell.style.split("attr=")[1])
if(cell.style.includes('svg+xml')) {//新增图库的图形
const decode_style = window.atob(cell.style.split("svg+xml,")[1].split(';')[0]);//svg解码，为字符串
const svgDocument = new DOMParser().parseFromString(decode_style, 'text/xml');//svg字符串转标签
const svgTag = svgDocument.getElementsByTagName('svg')[0];
const svgAttr = Array.from(svgTag.attributes);
svgAttr.forEach(item => {
if(item.name.includes('attr_')) {
const attr_name = item.name.split("attr_")[1];
const value_ = item.value.split("attr_")[1].split('&')[0];
const id_ = item.value.split("attr_")[1].split('&')[1].split("=")[1];
const attr_value = Base64.decode(value_);
attrArray.push({
id: id_,
name: attr_name,
value: attr_value,
})
}
})
if(attrArray.length > 0) {
attrArray.forEach(item => {
addListPanel(that, attrArray, item.name, item.value);
})
}
}
let currentNode = graph.getModel().getValue(cell);//获取没有属性的节点，返回的是文字
if(currentNode) {
if(typeof currentNode == 'string') {//此节点没有属性
var doc = mxUtils.createXmlDocument();
var obj = doc.createElement('object');
obj.setAttribute('label', currentNode || '');
currentNode = obj;//文字节点转化为 object标签，属性label值为文字
}
var clone_currentNode = currentNode.cloneNode(false);
if(attrArray.length > 0) {
attrArray.forEach(item => {
clone_currentNode.setAttribute(item.name, item.value);
})
}
}
// graph.getModel().setValue(cell, clone_currentNode);//更新图形界面
// if(objectTag) {
// if(typeof objectTag == 'object') {//意思是此节点是有属性的
// console.log(12)
// const attributeArr = Array.from(objectTag.attributes);
// attributeArr.shift();//去掉节点名称
// attributeArr.forEach(item => {
// addListPanel(that, item.name, item.value);
// })
// }
// }
}
const addListPanel = function(that, originAttr, attrName_, attrValue_) {
const add_item_container = document.createElement('div');
add_item_container.style.cssText = 'display: flex;justify-content: space-between;padding: 4px;';
add_item_container.className = 'add_item_container';
//属性名--------------------------------------------------------------------
const item_left_container = document.createElement('div');
item_left_container.style.cssText = 'display: flex;justify-content: center;width: 30%;';
const item_left_span = document.createElement('span');
item_left_span.innerHTML = attrName_ + ': ';
// const item_left_input = document.createElement('input');
// item_left_input.type = "text";
// item_left_input.value = attrName_;
// item_left_input.style.cssText = 'width: 50px;margin-left: 5px;';
// item_left_input.className = 'attrName';
// item_left_input.setAttribute('readonly', true);
// item_left_input.oninput = function (e) {
// // console.log('属性名')
// // console.log(e)
// // console.log(attrName_)
// }
item_left_container.appendChild(item_left_span);
// item_left_container.appendChild(item_left_input);
//属性值--------------------------------------------------------------------
const item_right_container = document.createElement('div');
item_right_container.style.cssText = 'margin-right: 15px;;margin-left: 5px;display: flex;justify-content: space-between;width: 70%;';
// const item_right_span = document.createElement('span');
// item_right_span.innerHTML = '属性值: ';
const item_right_input = document.createElement('input');
item_right_input.type = "text";
item_right_input.value = attrValue_;
item_right_input.style.cssText = 'width: 100%;';
item_right_input.className = 'attrValue';
item_right_input.oninput = function (e) {
const res = originAttr.find(item => item.name == attrName_);
res.value = e.data;
}
// var removeAttr = document.createElement('a');
// removeAttr.style.margin = '0px 8px 0 8px';
// removeAttr.style.width = '9px';
// removeAttr.style.height = '9px';
// removeAttr.style.cursor = 'pointer';
// var img = mxUtils.createImage(Dialog.prototype.closeImage);
// img.style.height = '9px';
// img.style.fontSize = '9px';
// removeAttr.setAttribute('title', mxResources.get('delete'));
// removeAttr.appendChild(img);
// removeAttr.onclick = function() {
// $(that).parents(".add_item_container").remove();
// // console.log($(that).parents(".add_item_container"))
// }
// item_right_container.appendChild(item_right_span);
item_right_container.appendChild(item_right_input);
// item_right_container.appendChild(removeAttr);
add_item_container.appendChild(item_left_container);
add_item_container.appendChild(item_right_container);
that.container.appendChild(add_item_container);
}
//初始化右侧属性面板控件
const attributeNode = function(that, label3, div, ui, addClickHandler, idx) {
var label4 = label3.cloneNode(false);//二次开发，自己写的属性面板
label4.style.backgroundColor = Format.inactiveTabBackgroundColor;
mxUtils.write(label4, mxResources.get('attribute'));
div.appendChild(label4);
var attributePanel = div.cloneNode(false);
attributePanel.style.display = 'none';
that.panels.push(new AttributePanel(that, ui, attributePanel));
that.container.appendChild(attributePanel);
addClickHandler(label4, attributePanel, idx++, true);
}
\ No newline at end of file
public/drawio/extention/js/exFormat.js
...@@ -42,22 +42,35 @@ const initAttributePanel = function(that) { ...@@ -42,22 +42,35 @@ const initAttributePanel = function(that) {
// that.addListPanel('', ''); // that.addListPanel('', '');
// }); // });
// button_container.appendChild(add_button); // button_container.appendChild(add_button);
let propertyList = [];
if(cell.style.includes('attr=')) {//属性列表
let haveAttrString = cell.style.match(/attr=\[[^\]]*\]/);
let stringAttr = haveAttrString[0].split('attr=')[1];
propertyList = JSON.parse(stringAttr);
}
//保存属性按钮-------------------------------------------------------------------------- //保存属性按钮--------------------------------------------------------------------------
const save_button = document.createElement('button'); const save_button = document.createElement('button');
save_button.innerHTML = '保存属性'; save_button.innerHTML = '保存属性';
save_button.style.cssText = 'padding: 4px;text-align: center;cursor: pointer;background-color: rgb(228,228,228);color: rgb(97, 97, 97);'; save_button.style.cssText = 'padding: 4px;text-align: center;cursor: pointer;background-color: rgb(228,228,228);color: rgb(97, 97, 97);';
let attrArray = [];
save_button.addEventListener('click', () => { save_button.addEventListener('click', () => {
let propertyArray = []; let propertyArray = [];
if(attrArray.length > 0) { if(propertyList.length > 0) {
attrArray.forEach(item => { propertyList.forEach(item => {
propertyArray.push({ propertyArray.push({
propertyId: Number(item.id), propertyId: item.id,
propertyValue: item.value propertyValue: item.value
}) })
}) })
...@@ -70,47 +83,29 @@ const initAttributePanel = function(that) { ...@@ -70,47 +83,29 @@ const initAttributePanel = function(that) {
that.container.appendChild(button_container); that.container.appendChild(button_container);
if(cell.style.includes('svg+xml')) {//新增图库的图形 if(propertyList.length > 0) {
const decode_style = window.atob(cell.style.split("svg+xml,")[1].split(';')[0]);//svg解码，为字符串 propertyList.forEach(item => {
const svgDocument = new DOMParser().parseFromString(decode_style, 'text/xml');//svg字符串转标签 addListPanel(that, propertyList, item.name, item.value);
const svgTag = svgDocument.getElementsByTagName('svg')[0];
const svgAttr = Array.from(svgTag.attributes);
svgAttr.forEach(item => {
if(item.name.includes('attr_')) {
const attr_name = item.name.split("attr_")[1];
const value_ = item.value.split("attr_")[1].split('&')[0];
const id_ = item.value.split("attr_")[1].split('&')[1].split("=")[1];
const attr_value = Base64.decode(value_);
attrArray.push({
id: id_,
name: attr_name,
value: attr_value,
})
}
}) })
if(attrArray.length > 0) {
attrArray.forEach(item => {
addListPanel(that, attrArray, item.name, item.value);
})
}
} }
let currentNode = graph.getModel().getValue(cell);//获取没有属性的节点，返回的是文字 // let currentNode = graph.getModel().getValue(cell);//获取没有属性的节点，返回的是文字
if(typeof currentNode == 'string') {//此节点没有属性 // if(currentNode) {
var doc = mxUtils.createXmlDocument(); // if(typeof currentNode == 'string') {//此节点没有属性
var obj = doc.createElement('object'); // var doc = mxUtils.createXmlDocument();
obj.setAttribute('label', currentNode || ''); // var obj = doc.createElement('object');
currentNode = obj;//文字节点转化为 object标签，属性label值为文字 // obj.setAttribute('label', currentNode || '');
} // currentNode = obj;//文字节点转化为 object标签，属性label值为文字
var clone_currentNode = currentNode.cloneNode(false); // }
if(attrArray.length > 0) {
attrArray.forEach(item => { // var clone_currentNode = currentNode.cloneNode(false);
clone_currentNode.setAttribute(item.name, item.value); // if(attrArray.length > 0) {
}) // attrArray.forEach(item => {
} // clone_currentNode.setAttribute(item.name, item.value);
// })
// }
// }
// graph.getModel().setValue(cell, clone_currentNode);//更新图形界面 // graph.getModel().setValue(cell, clone_currentNode);//更新图形界面
// if(objectTag) { // if(objectTag) {
......
public/drawio/js/diagramly/App.js
...@@ -186,7 +186,7 @@ App = function(editor, container, lightbox) ...@@ -186,7 +186,7 @@ App = function(editor, container, lightbox)
const that = this; const that = this;
setGraphDefault(that); setGraphDefault(that);
leftCustomGraph(that); // leftCustomGraph(that);
// var graph = this.editor.graph; // var graph = this.editor.graph;
// setGraphOnlyView(graph) // setGraphOnlyView(graph)
......
public/drawio/js/diagramly/DrawioFile.js
...@@ -1889,11 +1889,11 @@ DrawioFile.prototype.saveDraft = function() ...@@ -1889,11 +1889,11 @@ DrawioFile.prototype.saveDraft = function()
this.ui.setDatabaseItem('.draft_' + this.draftId, this.ui.setDatabaseItem('.draft_' + this.draftId,
JSON.stringify(draft)); JSON.stringify(draft));
console.log('设置数据到数据库') // console.log('设置数据到数据库')
console.log('.draft_' + this.draftId) // console.log('.draft_' + this.draftId)
this.ui.getDatabaseItem('.draft_' + this.draftId, function(res) { // this.ui.getDatabaseItem('.draft_' + this.draftId, function(res) {//解释: 设置数据到数据库
console.log(res.data) // console.log(res.data)
}); // });
const saveFileData = new File([ this.ui.getFileData() ], '测试.xml', { type: "text/xml" }); const saveFileData = new File([ this.ui.getFileData() ], '测试.xml', { type: "text/xml" });
const formData = new FormData(); const formData = new FormData();
......
public/drawio/js/diagramly/sidebar/Sidebar-ArchiEA.js
...@@ -2,32 +2,106 @@ ...@@ -2,32 +2,106 @@
* 动态获取架构设计的分层归属信息（业务架构、应用架构、数据架构、技术架构、安全架构等信息） * 动态获取架构设计的分层归属信息（业务架构、应用架构、数据架构、技术架构、安全架构等信息）
* 该方法可以将归属信息、元素信息带出 * 该方法可以将归属信息、元素信息带出
*/ */
// (function()// 旧代码--------------------------------------------------------------
// {
// Sidebar.prototype.addEAPalette = function()
// {
// this.setCurrentSearchEntryLibrary('eachart');
// $.ajax({
// url: '/drawio/eachart.json', // 代表请求的服务器地址
// method: 'get', // 使用的请求方法
// contentType: 'application/x-www-form-urlencoded', // 请求的 enctype
// dataType: 'json', // 默认根据 response 头部的信息自动推测
// async: true, // 是否使用异步请求的方式
// }).done(data => {
// var ea = data.eadata;
// if(ea) {
// ea.forEach(ele => {
// var ii = ele.elements;
// var items = [];
// ii.forEach(element => {
// // items.push(this.createVertexTemplateEntry(element.styles, element.w, element.h, null, element.name, null, null, element.name));
// items.push(
// this.createEdgeTemplateEntry('endArrow=none;html=1;姓名=测试;', 50, 50, '', 'Line', null, 'simple undirected plain blank no')
// );
// });
// this.addPaletteFunctions(ea.id, ele.title, false, items);
// });
// }
// });
// // this.setCurrentSearchEntryLibrary();
// };
// })();
(function() (function()
{ {
Sidebar.prototype.addEAPalette = function() Sidebar.prototype.addEAPalette = function()
{ {
this.setCurrentSearchEntryLibrary('eachart'); const leftGraph = JSON.parse(localStorage.getItem('leftGraph'));
$.ajax({
url: '/drawio/eachart.json', // 代表请求的服务器地址
method: 'get', // 使用的请求方法
contentType: 'application/x-www-form-urlencoded', // 请求的 enctype
dataType: 'json', // 默认根据 response 头部的信息自动推测
async: true, // 是否使用异步请求的方式
}).done((data) => {
var ea = data.eadata;
if(ea) {
ea.forEach(ele => {
var ii = ele.elements;
var items = [];
ii.forEach(element => {
items.push(this.createVertexTemplateEntry(element.styles, element.w, element.h, null, element.name, null, null, element.name));
});
this.addPaletteFunctions(ea.id, ele.title, false, items);
});
}
});
this.setCurrentSearchEntryLibrary(); leftGraph.forEach(item => {
}; let fns = [];
item.eleDtos.forEach(item2 => {
if(item2.icon) {
if(item2.icon.includes('data')) {
const item_icon = item2.icon.split("base64,")[1];
const decode_item_icon = (window.atob) ? atob(item_icon) : Base64.decode(item_icon);//svg解码，为字符串
const svgDocument = new DOMParser().parseFromString(decode_item_icon, 'text/xml');//svg字符串转标签
const svgTag = svgDocument.getElementsByTagName('svg')[0];
const width = +svgTag.getAttribute('width').split("px")[0];
const height = +svgTag.getAttribute('height').split("px")[0];
let attr_ = [];
if(item2.dicys && item2.dicys.length > 0) {
item2.dicys.forEach(res => {
if(res.fieldName) {
attr_.push(
{
name: res.fieldName,
value: res.propertyValue,
id: res.propertyId
}
)
}
})
}
fns.push(
item2.color ? this.createVertexTemplateEntry(item2.iconName+';fillColor='+item2.color+';'+'attr='+JSON.stringify(attr_), width, height, null, item2.eleName, null, null, '封闭图形2') : this.createEdgeTemplateEntry(item2.iconName+'attr='+JSON.stringify(attr_), width, height, '', item2.elementName, null, '非封闭图形2')
)
}
}
})
this.addPaletteFunctions(item.arciBelongId, item.arciBelongName, false, fns);
});
})();
// $.ajax({
// url: '/drawio/eachart.json', // 代表请求的服务器地址
// method: 'get', // 使用的请求方法
// contentType: 'application/x-www-form-urlencoded', // 请求的 enctype
// dataType: 'json', // 默认根据 response 头部的信息自动推测
// async: true, // 是否使用异步请求的方式
// }).done(data => {
// var ea = data.eadata;
// if(ea) {
// ea.forEach(ele => {
// var ii = ele.elements;
// var items = [];
// ii.forEach(element => {
// // items.push(this.createVertexTemplateEntry(element.styles, element.w, element.h, null, element.name, null, null, element.name));
// items.push(
// this.createEdgeTemplateEntry('endArrow=none;html=1;姓名=测试;', 50, 50, '', 'Line', null, 'simple undirected plain blank no')
// );
// });
// this.addPaletteFunctions(ea.id, ele.title, false, items);
// });
// }
// });
};
})();
\ No newline at end of file
public/drawio/js/diagramly/sidebar/Sidebar.js
...@@ -1208,10 +1208,12 @@ ...@@ -1208,10 +1208,12 @@
this.addWebIconsPalette(); this.addWebIconsPalette();
this.addWebLogosPalette(); this.addWebLogosPalette();
this.addSignsPalette(signs, dir); this.addSignsPalette(signs, dir);
// this.addEAPalette(); //二次开发，增加动态读取架构设计要素 this.addEAPalette(); //二次开发，增加动态读取架构设计要素
// LATER: Check if conflicts with restore libs after loading file // LATER: Check if conflicts with restore libs after loading file
this.showEntries(); this.showEntries();
if (this.createdSearchIndex != null) if (this.createdSearchIndex != null)
{ {
console.log('searchFileData', Graph.compress(JSON.stringify(this.createdSearchIndex))); console.log('searchFileData', Graph.compress(JSON.stringify(this.createdSearchIndex)));
......
public/drawio/js/grapheditor/Shapes.js
...@@ -7,6 +7,22 @@ ...@@ -7,6 +7,22 @@
*/ */
(function() (function()
{ {
// function ComplexSvgShape()
// {
// mxShape.call(this);
// };
// mxUtils.extend(ComplexSvgShape, mxShape);
// ComplexSvgShape.prototype.paintVertexShape = function(c, x, y, w, h)
// {
// c.begin();
// c.addSvgElement('rect', [x, y, w, h], 'fill=blue');
// c.stroke();
// };
// mxCellRenderer.registerShape('myComplexSvgShape', ComplexSvgShape);
function TableLineShape(line, stroke, strokewidth) function TableLineShape(line, stroke, strokewidth)
{ {
mxShape.call(this); mxShape.call(this);
......
public/drawio/js/grapheditor/Sidebar.js
...@@ -813,7 +813,7 @@ Sidebar.prototype.addEntry = function(tags, fn) ...@@ -813,7 +813,7 @@ Sidebar.prototype.addEntry = function(tags, fn)
} }
} }
} }
for (var i = 0; i < tagList.length; i++) for (var i = 0; i < tagList.length; i++)
{ {
this.addEntryForTag(tagList[i], fn); this.addEntryForTag(tagList[i], fn);
...@@ -1424,7 +1424,6 @@ Sidebar.prototype.addGeneralPalette = function(expand) ...@@ -1424,7 +1424,6 @@ Sidebar.prototype.addGeneralPalette = function(expand)
cell0.setConnectable(false); cell0.setConnectable(false);
cell0.vertex = true; cell0.vertex = true;
edge.insert(cell0); edge.insert(cell0);
return this.createEdgeTemplateFromCells([edge], 100, 0, 'Connector with Label'); return this.createEdgeTemplateFromCells([edge], 100, 0, 'Connector with Label');
})), })),
this.addEntry(lineTags + 'edge title multiplicity', mxUtils.bind(this, function() this.addEntry(lineTags + 'edge title multiplicity', mxUtils.bind(this, function()
...@@ -2322,7 +2321,7 @@ Sidebar.prototype.createItem = function(cells, title, showLabel, showTitle, widt ...@@ -2322,7 +2321,7 @@ Sidebar.prototype.createItem = function(cells, title, showLabel, showTitle, widt
elt.style.width = (thumbWidth + border) + 'px'; elt.style.width = (thumbWidth + border) + 'px';
elt.style.height = (thumbHeight + border) + 'px'; elt.style.height = (thumbHeight + border) + 'px';
elt.style.padding = this.thumbPadding + 'px'; elt.style.padding = this.thumbPadding + 'px';
// Blocks default click action // Blocks default click action
mxEvent.addListener(elt, 'click', function(evt) mxEvent.addListener(elt, 'click', function(evt)
{ {
...@@ -3883,11 +3882,12 @@ Sidebar.prototype.createVertexTemplateFromCells = function(cells, width, height, ...@@ -3883,11 +3882,12 @@ Sidebar.prototype.createVertexTemplateFromCells = function(cells, width, height,
}; };
/** /**
* * 解释: 创建非封闭图形
*/ */
Sidebar.prototype.createEdgeTemplateEntry = function(style, width, height, value, title, showLabel, Sidebar.prototype.createEdgeTemplateEntry = function(style, width, height, value, title, showLabel,
tags, allowCellsInserted, showTooltip) tags, allowCellsInserted, showTooltip)
{ {
tags = (tags != null && tags.length > 0) ? tags : title.toLowerCase(); tags = (tags != null && tags.length > 0) ? tags : title.toLowerCase();
return this.addEntry(tags, mxUtils.bind(this, function() return this.addEntry(tags, mxUtils.bind(this, function()
...@@ -3907,7 +3907,7 @@ Sidebar.prototype.createEdgeTemplate = function(style, width, height, value, tit ...@@ -3907,7 +3907,7 @@ Sidebar.prototype.createEdgeTemplate = function(style, width, height, value, tit
cell.geometry.setTerminalPoint(new mxPoint(width, 0), false); cell.geometry.setTerminalPoint(new mxPoint(width, 0), false);
cell.geometry.relative = true; cell.geometry.relative = true;
cell.edge = true; cell.edge = true;
return this.createEdgeTemplateFromCells([cell], width, height, title, showLabel, allowCellsInserted, showTooltip); return this.createEdgeTemplateFromCells([cell], width, height, title, showLabel, allowCellsInserted, showTooltip);
}; };
......
src/views/archi-view-manage/index.vue
...@@ -204,10 +204,11 @@ export default { ...@@ -204,10 +204,11 @@ export default {
const params = { const params = {
metaModelId: id metaModelId: id
} }
getDrawioLeftGraph(params).then(res => { return new Promise((resolve, reject) => {
res.data.reverse(); getDrawioLeftGraph(params).then(res => {
localStorage.setItem('leftGraph', JSON.stringify(res.data)); resolve(res);
}) })
});
}, },
to_current_details(item) {//跳转到详情 to_current_details(item) {//跳转到详情
const params = { const params = {
...@@ -221,8 +222,18 @@ export default { ...@@ -221,8 +222,18 @@ export default {
localStorage.setItem('xmlData', xmlData); localStorage.setItem('xmlData', xmlData);
localStorage.setItem('xmlTitle', xmlTitle); localStorage.setItem('xmlTitle', xmlTitle);
this.queryDrawioGraph(id); this.queryDrawioGraph(id).then(res2 => {
this.$router.push( `/main/archiViewManageDetails/id=${id}`, () => {}, () => {} ); if(res2.code == 200) {
res2.data.reverse();
localStorage.setItem('leftGraph', JSON.stringify(res2.data));
this.$router.push( `/main/archiViewManageDetails/id=${id}`, () => {}, () => {} );
}else {
Message({
type: 'error',
message: res2.msg
});
}
});
} }
}); });
}, },
......
src/views/meta-model-list/index.vue
...@@ -305,8 +305,19 @@ export default { ...@@ -305,8 +305,19 @@ export default {
const xmlTitle = res.data.verName; const xmlTitle = res.data.verName;
localStorage.setItem('xmlData', xmlData); localStorage.setItem('xmlData', xmlData);
localStorage.setItem('xmlTitle', xmlTitle); localStorage.setItem('xmlTitle', xmlTitle);
this.queryDrawioGraph(item.metaModelId); this.queryDrawioGraph(item.metaModelId).then(res2 => {
this.$router.push( `/main/metaModelListDetails/id=${item.metaModelId}&version=${item.version}`, () => {}, () => {} ); if(res2.code == 200) {
res2.data.reverse();
localStorage.setItem('leftGraph', JSON.stringify(res2.data));
this.$router.push( `/main/metaModelListDetails/id=${item.metaModelId}&version=${item.version}`, () => {}, () => {} );
}else {
Message({
type: 'error',
message: res2.msg
});
}
})
} }
}); });
}, },
...@@ -314,9 +325,10 @@ export default { ...@@ -314,9 +325,10 @@ export default {
const params = { const params = {
metaModelId: id metaModelId: id
} }
getDrawioLeftGraph(params).then(res => { return new Promise((resolve, reject) => {
res.data.reverse(); getDrawioLeftGraph(params).then(res => {
localStorage.setItem('leftGraph', JSON.stringify(res.data)); resolve(res);
})
}) })
}, },
handleCommand(command) {//新建按钮点击 handleCommand(command) {//新建按钮点击
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!