Commit 3a0bb1ff by liuyong

修改bug

1 parent e5b85690
...@@ -13,8 +13,8 @@ const customSaveFileMenu = function(that, editorUi) {//自定义保存文件菜 ...@@ -13,8 +13,8 @@ const customSaveFileMenu = function(that, editorUi) {//自定义保存文件菜
var parser = new DOMParser(); var parser = new DOMParser();
var xmlDoc = parser.parseFromString(composedXMLData, "text/xml"); var xmlDoc = parser.parseFromString(composedXMLData, "text/xml");
const mxGraphModel = xmlDoc.getElementsByTagName('diagram')[0].innerHTML; const mxGraphModel = xmlDoc.getElementsByTagName('diagram')[0].innerHTML;
var graph = editorUi.editor.graph; var graph = editorUi.editor.graph;
var svgImage = graph.getSvg('#fff', 1, 0, true, null, true, null, null, null, null, true, 'light', 'diagram');//当前画布的预览图,svg格式 var svgImage = graph.getSvg('#fff', 1, 0, true, null, true, null, null, null, null, true, 'light', 'diagram');//当前画布的预览图,svg格式
var svgToString = new XMLSerializer().serializeToString(svgImage); var svgToString = new XMLSerializer().serializeToString(svgImage);
var base64SvgToString = Base64.encode(svgToString); var base64SvgToString = Base64.encode(svgToString);
......
...@@ -39,82 +39,90 @@ ...@@ -39,82 +39,90 @@
{ {
Sidebar.prototype.addCustomGraph = function() Sidebar.prototype.addCustomGraph = function()
{ {
const commonGraph = JSON.parse(localStorage.getItem('commonGraph'));
this.sidebarTitles = true;//勾选标签
const commonGraph_ = JSON.parse(localStorage.getItem('commonGraph'));
if(commonGraph_.show) {
const graphGroup = window.location.href.split("id=")[1].split("&")[1].split("=")[1];
commonGraph.forEach(item => { const commonGraph = commonGraph_.graph.filter(item => item.arciBelongId == graphGroup);
let fns = [];
item.eleDtos.forEach(item2 => { this.sidebarTitles = true;//勾选标签
if(item2.icon) {
if(item2.icon.includes('data')) {
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,
controlType: res.controlType,
}
)
}
})
}
fns.push( commonGraph.forEach(item => {
item2.color ? this.createVertexTemplateEntry( let fns = [];
item2.iconName + ';fillColor=' + item2.color + ';' + 'attr=' + JSON.stringify(attr_) + ';eleId=' + item2.eleBelongId + ';eaLevel=' + item2.eaLevel + ';',
item2.shapeWidth ? item2.shapeWidth : 150, item.eleDtos.forEach(item2 => {
item2.shapeHeight ? item2.shapeHeight : 75, if(item2.icon) {
null, if(item2.icon.includes('data')) {
item2.eleName, let attr_ = [];
null, if(item2.dicys && item2.dicys.length > 0) {
null, item2.dicys.forEach(res => {
'封闭图形2' if(res.fieldName) {
) : this.createEdgeTemplateEntry( attr_.push(
item2.iconName + 'attr=' + JSON.stringify(attr_), {
item2.shapeWidth ? item2.shapeWidth : 150, name: res.fieldName,
item2.shapeHeight ? item2.shapeHeight : 75, value: res.propertyValue,
'', id: res.propertyId,
item2.elementName, controlType: res.controlType,
null, }
'非封闭图形2' )
}
})
}
fns.push(
item2.color ? this.createVertexTemplateEntry(
item2.iconName + ';fillColor=' + item2.color + ';' + 'attr=' + JSON.stringify(attr_) + ';eleId=' + item2.eleBelongId + ';eaLevel=' + item2.eaLevel + ';',
item2.shapeWidth ? item2.shapeWidth : 150,
item2.shapeHeight ? item2.shapeHeight : 75,
null,
item2.eleName,
null,
null,
'封闭图形2'
) : this.createEdgeTemplateEntry(
item2.iconName + 'attr=' + JSON.stringify(attr_),
item2.shapeWidth ? item2.shapeWidth : 150,
item2.shapeHeight ? item2.shapeHeight : 75,
'',
item2.elementName,
null,
'非封闭图形2'
)
) )
) }
} }
} })
}) this.addPaletteFunctions(item.arciBelongId, item.arciBelongName, false, fns);
this.addPaletteFunctions(item.arciBelongId, item.arciBelongName, false, fns); });
});
// $.ajax({
// $.ajax({ // url: '/drawio/eachart.json', // 代表请求的服务器地址
// url: '/drawio/eachart.json', // 代表请求的服务器地址 // method: 'get', // 使用的请求方法
// method: 'get', // 使用的请求方法 // contentType: 'application/x-www-form-urlencoded', // 请求的 enctype
// contentType: 'application/x-www-form-urlencoded', // 请求的 enctype // dataType: 'json', // 默认根据 response 头部的信息自动推测
// dataType: 'json', // 默认根据 response 头部的信息自动推测 // async: true, // 是否使用异步请求的方式
// async: true, // 是否使用异步请求的方式 // }).done(data => {
// }).done(data => { // var ea = data.eadata;
// var ea = data.eadata; // if(ea) {
// if(ea) { // ea.forEach(ele => {
// ea.forEach(ele => { // var ii = ele.elements;
// var ii = ele.elements; // var items = [];
// var items = []; // ii.forEach(element => {
// ii.forEach(element => { // // items.push(this.createVertexTemplateEntry(element.styles, element.w, element.h, null, element.name, null, null, element.name));
// // items.push(this.createVertexTemplateEntry(element.styles, element.w, element.h, null, element.name, null, null, element.name));
// items.push(
// items.push( // this.createEdgeTemplateEntry('endArrow=none;html=1;姓名=测试;', 50, 50, '', 'Line', null, 'simple undirected plain blank no')
// this.createEdgeTemplateEntry('endArrow=none;html=1;姓名=测试;', 50, 50, '', 'Line', null, 'simple undirected plain blank no') // );
// );
// });
// }); // this.addPaletteFunctions(ea.id, ele.title, false, items);
// this.addPaletteFunctions(ea.id, ele.title, false, items); // });
// }); // }
// } // });
// }); }
}; };
})(); })();
\ No newline at end of file
...@@ -444,13 +444,23 @@ ...@@ -444,13 +444,23 @@
cursor:pointer; cursor:pointer;
margin:5px; margin:5px;
} }
/* 二次开发,修改菜单栏背景色 */ /* 二次开发,修改菜单栏背景色并隐藏 */
.geMenubarContainer{ .geMenubarContainer{
background-color: #fff; background-color: #fff;
display: none;
} }
/* 二次开发,修改工具栏背景色 */ /* 二次开发,修改工具栏背景色并隐藏 */
.geToolbarContainer{ .geToolbarContainer{
background-color: #fff; background-color: #fff;
display: none;
}
/* 二次开发,设置左右侧工具栏位置 */
.geSidebarContainer{
top: 3px !important;
}
/* 二次开发,设置中间画布位置 */
.geDiagramContainer{
inset: 4px 240px 0px 212px !important;
} }
</style> </style>
<!-- Workaround for binary XHR in IE 9/10, see App.loadUrl --> <!-- Workaround for binary XHR in IE 9/10, see App.loadUrl -->
......
...@@ -5212,7 +5212,7 @@ EditorUi.prototype.createUi = function() ...@@ -5212,7 +5212,7 @@ EditorUi.prototype.createUi = function()
if (this.container != null && this.tabContainer != null) if (this.container != null && this.tabContainer != null)
{ {
this.container.appendChild(this.tabContainer);//解释,显示底部的分页 // this.container.appendChild(this.tabContainer);//二次开发,隐藏底部的分页
} }
// Creates toolbar // Creates toolbar
......
...@@ -297,7 +297,7 @@ Format.prototype.immediateRefresh = function() ...@@ -297,7 +297,7 @@ Format.prototype.immediateRefresh = function()
label2.style.borderLeftWidth = '1px'; label2.style.borderLeftWidth = '1px';
label2.style.borderRightWidth = '1px'; label2.style.borderRightWidth = '1px';
label2.style.backgroundColor = Format.inactiveTabBackgroundColor; label2.style.backgroundColor = Format.inactiveTabBackgroundColor;
label2.style.display = 'none';
addClickHandler(label, diagramPanel, idx++); addClickHandler(label, diagramPanel, idx++);
var stylePanel = div.cloneNode(false); var stylePanel = div.cloneNode(false);
......
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<iframe <iframe
id="drawioGraph" id="drawioGraph"
name="content_frame" name="content_frame"
:src="'/drawio/index.html?id='+id" :src="'/drawio/index.html?id='+id+'&info='+info"
frameborder=0 frameborder=0
scrolling="no"> scrolling="no">
</iframe> </iframe>
...@@ -15,13 +15,14 @@ ...@@ -15,13 +15,14 @@
data() { data() {
return { return {
id: null, id: null,
info: null
}; };
}, },
watch: { watch: {
initGraphId: { initGraphId: {
handler(newVal, oldVal) { handler(newVal, oldVal) {
// console.log(newVal)
this.id = newVal.id; this.id = newVal.id;
this.info = newVal.info;
}, },
} }
}, },
......
...@@ -66,7 +66,7 @@ const routes = [ ...@@ -66,7 +66,7 @@ const routes = [
component: () => import('@/views/meta-model-list/index.vue'), component: () => import('@/views/meta-model-list/index.vue'),
}, },
{ {
path: '/main/metaModelListDetails/:id',//元模型管理详情 path: '/main/metaModelListDetails',//元模型管理详情
name: 'metaModelListDetails', name: 'metaModelListDetails',
component: () => import('@/views/meta-model-list/details.vue'), component: () => import('@/views/meta-model-list/details.vue'),
}, },
...@@ -121,7 +121,7 @@ const routes = [ ...@@ -121,7 +121,7 @@ const routes = [
component: () => import('@/views/archi-view-manage/index.vue'), component: () => import('@/views/archi-view-manage/index.vue'),
}, },
{ {
path: '/main/archiViewManageDetails/:id',//架构视图管理详情 path: '/main/archiViewManageDetails',//架构视图管理详情
name: 'archiViewManageDetails', name: 'archiViewManageDetails',
component: () => import('@/views/archi-view-manage/details.vue'), component: () => import('@/views/archi-view-manage/details.vue'),
}, },
......
...@@ -408,7 +408,7 @@ ...@@ -408,7 +408,7 @@
assetId: this.is_add_edit == 'add' ? null : this.editId, assetId: this.is_add_edit == 'add' ? null : this.editId,
parentAssetId: this.selectValue, parentAssetId: this.selectValue,
parentAssetName: this.selectLabel, parentAssetName: this.selectLabel,
isShow: this.ruleForm.let5 == '显示' ? 1 : 0, isShow: this.ruleForm.let5 == '显示' ? 0 : 1,
fieldsValue: fieldsValue, fieldsValue: fieldsValue,
targetAsset: targetAsset, targetAsset: targetAsset,
assetCode: this.selectCode, assetCode: this.selectCode,
...@@ -546,7 +546,7 @@ ...@@ -546,7 +546,7 @@
this.ruleForm.let2 = row.parentAssetName; this.ruleForm.let2 = row.parentAssetName;
this.ruleForm.let3 = row.archiEleId; this.ruleForm.let3 = row.archiEleId;
this.ruleForm.let4 = row.sort; this.ruleForm.let4 = row.sort;
this.ruleForm.let5 = row.isShow == 1 ? '显示' : '隐藏'; this.ruleForm.let5 = row.isShow == 0 ? '显示' : '隐藏';
this.editId = row.assetId; this.editId = row.assetId;
let fieldsValue = row.fieldsValue; let fieldsValue = row.fieldsValue;
let targetAsset = row.targetAsset; let targetAsset = row.targetAsset;
......
...@@ -192,7 +192,7 @@ ...@@ -192,7 +192,7 @@
:close-on-click-modal="false" :close-on-click-modal="false"
width="60%"> width="60%">
<el-tabs type="border-card" v-model="tabType" @tab-click="tabsClick"> <el-tabs type="border-card" v-model="tabType" @tab-click="tabsClick">
<el-tab-pane label="标准图元" name="标准图元" style="height: 400px;"> <el-tab-pane label="元模型图元" name="元模型图元" style="height: 400px;">
<div style="height: 400px;display: flex;align-items: center;"> <div style="height: 400px;display: flex;align-items: center;">
<div style="width: 20%;height: 100%;border-left: 1px solid #ccc;border-top: 1px solid #ccc;border-bottom: 1px solid #ccc;overflow: auto;text-align: center;"> <div style="width: 20%;height: 100%;border-left: 1px solid #ccc;border-top: 1px solid #ccc;border-bottom: 1px solid #ccc;overflow: auto;text-align: center;">
<div :style="{ 'cursor': 'pointer', 'padding': '4px', 'background-color': nameIndex2 == index ? 'rgb(13,134,127)' : '#fff', 'color': nameIndex2 == index ? '#fff' : '#000' }" <div :style="{ 'cursor': 'pointer', 'padding': '4px', 'background-color': nameIndex2 == index ? 'rgb(13,134,127)' : '#fff', 'color': nameIndex2 == index ? '#fff' : '#000' }"
...@@ -318,7 +318,7 @@ export default { ...@@ -318,7 +318,7 @@ export default {
graphIndex2: -1, graphIndex2: -1,
selectGraphSrc: '', selectGraphSrc: '',
selectGraphShape: '', selectGraphShape: '',
tabType: '标准图元' tabType: '元模型图元'
}; };
}, },
mounted(){ mounted(){
...@@ -347,7 +347,7 @@ export default { ...@@ -347,7 +347,7 @@ export default {
return; return;
} }
this.graph_dialog = false; this.graph_dialog = false;
if(this.tabType == '标准图元') { if(this.tabType == '元模型图元') {
this.selectGraphSrc = this.standardList[this.graphIndex2].icon; this.selectGraphSrc = this.standardList[this.graphIndex2].icon;
this.selectGraphShape = this.standardList[this.graphIndex2].iconName; this.selectGraphShape = this.standardList[this.graphIndex2].iconName;
}else { }else {
...@@ -492,7 +492,7 @@ export default { ...@@ -492,7 +492,7 @@ export default {
return; return;
} }
let iconName; let iconName;
if(this.tabType == '标准图元') { if(this.tabType == '元模型图元') {
iconName = this.selectGraphShape; iconName = this.selectGraphShape;
}else { }else {
iconName = this.selectGraphShape + 'fillColor='+this.ruleForm.let6+';'; iconName = this.selectGraphShape + 'fillColor='+this.ruleForm.let6+';';
...@@ -558,7 +558,7 @@ export default { ...@@ -558,7 +558,7 @@ export default {
return; return;
} }
let iconName; let iconName;
if(this.tabType == '标准图元') { if(this.tabType == '元模型图元') {
iconName = this.selectGraphShape; iconName = this.selectGraphShape;
}else { }else {
iconName = this.selectGraphShape + 'fillColor='+this.ruleForm.let6+';'; iconName = this.selectGraphShape + 'fillColor='+this.ruleForm.let6+';';
......
...@@ -71,46 +71,48 @@ ...@@ -71,46 +71,48 @@
}, },
mounted(){ mounted(){
this.get_search_select1(); this.get_search_select1();
const id = window.location.href.split("id=")[1].split("&")[0]; const id = this.$route.query.id;
const graphGroup = this.$route.query.info;
this.routerId = { this.routerId = {
id, id: id,
info: graphGroup
} }
window.onmessage = e => { window.onmessage = e => {
if(e.data.type == 'saveData') { // if(e.data.type == 'saveData') {
MessageBox.confirm('确定保存?', '提示', { // MessageBox.confirm('确定保存?', '提示', {
confirmButtonText: '确定', // confirmButtonText: '确定',
cancelButtonText: '取消', // cancelButtonText: '取消',
customClass: 'messageClass', // customClass: 'messageClass',
confirmButtonClass: 'confirmClass', // confirmButtonClass: 'confirmClass',
type: 'warning' // type: 'warning'
}).then(() => { // }).then(() => {
this.saveCanvas(id, e.data.data.mxGraphModel, e.data.data.base64SvgToString); // this.saveCanvas(id, e.data.data.mxGraphModel, e.data.data.base64SvgToString);
}).catch(() => { // }).catch(() => {
Message({ // Message({
type: 'info', // type: 'info',
message: '已取消' // message: '已取消'
}); // });
}); // });
} // }
if(e.data.type == 'saveVersion'){ // if(e.data.type == 'saveVersion'){
MessageBox.confirm('确定发布版本?', '提示', { // MessageBox.confirm('确定发布版本?', '提示', {
confirmButtonText: '确定', // confirmButtonText: '确定',
cancelButtonText: '取消', // cancelButtonText: '取消',
customClass: 'messageClass', // customClass: 'messageClass',
confirmButtonClass: 'confirmClass', // confirmButtonClass: 'confirmClass',
type: 'warning' // type: 'warning'
}).then(() => { // }).then(() => {
this.releaseVersion(id); // this.releaseVersion(id);
}).catch(() => { // }).catch(() => {
Message({ // Message({
type: 'info', // type: 'info',
message: '已取消' // message: '已取消'
}); // });
}); // });
} // }
if(e.data.type == 'saveProperty'){ if(e.data.type == 'saveProperty'){
this.saveAttribute(e.data.data); this.saveAttribute(e.data.data);
...@@ -131,7 +133,7 @@ ...@@ -131,7 +133,7 @@
this.graphList = res.eleDtos; this.graphList = res.eleDtos;
}, },
get_search_select1() {//查询架构归属下拉框值 get_search_select1() {//查询架构归属下拉框值
const commonGraph = JSON.parse(localStorage.getItem("commonGraph")); const commonGraph = JSON.parse(localStorage.getItem("commonGraph")).graph;
commonGraph.reverse(); commonGraph.reverse();
this.search_select1 = commonGraph; this.search_select1 = commonGraph;
}, },
...@@ -191,44 +193,44 @@ ...@@ -191,44 +193,44 @@
} }
}); });
}, },
saveCanvas(id, mxGraphModel, base64SvgToString) {//保存文件 // saveCanvas(id, mxGraphModel, base64SvgToString) {//保存文件
const params = { // const params = {
viewDetailsId: id, // viewDetailsId: id,
metaModelData: mxGraphModel, // metaModelData: mxGraphModel,
metaModelSvg: base64SvgToString // metaModelSvg: base64SvgToString
} // }
saveArchiViewManageCardDetails(params).then(res => { // saveArchiViewManageCardDetails(params).then(res => {
if(res.code == 200) { // if(res.code == 200) {
Message({ // Message({
type: 'success', // type: 'success',
message: '保存成功!', // message: '保存成功!',
}); // });
}else { // }else {
Message({ // Message({
type: 'error', // type: 'error',
message: res.msg // message: res.msg
}); // });
} // }
}) // })
}, // },
releaseVersion(id) {//版本发布 // releaseVersion(id) {//版本发布
const params = { // const params = {
viewDetailsId: id, // viewDetailsId: id,
} // }
saveVersionArchiViewManageCardDetails(params).then(res => { // saveVersionArchiViewManageCardDetails(params).then(res => {
if(res.code == 200) { // if(res.code == 200) {
Message({ // Message({
type: 'success', // type: 'success',
message: '版本发布成功!', // message: '版本发布成功!',
}); // });
}else { // }else {
Message({ // Message({
type: 'error', // type: 'error',
message: res.msg // message: res.msg
}); // });
} // }
}) // })
} // }
} }
} }
</script> </script>
......
<template> <template>
<div class="Details"> <div class="Details">
<template v-if="showBtn">
<el-button type="text" class="backPrevGraphbtn" @click="backGraph">返回上级图形</el-button>
<el-button type="text" class="versionBtn" @click="releaseVersion">版本发布</el-button>
<el-button type="text" class="saveFileBtn" @click="saveFile">保存</el-button>
</template>
<el-tabs type="border-card" @tab-click="tabs_click_func"> <el-tabs type="border-card" @tab-click="tabs_click_func">
<el-tab-pane> <el-tab-pane>
<span slot="label"> <span slot="label">
...@@ -27,7 +33,11 @@ ...@@ -27,7 +33,11 @@
import Graph from './canvas/index.vue'; import Graph from './canvas/index.vue';
import Tables from './table/index.vue'; import Tables from './table/index.vue';
import Mind from './mind/index.vue'; import Mind from './mind/index.vue';
import { MessageBox, Message } from 'element-ui';
import {
saveVersionArchiViewManageCardDetails,
saveArchiViewManageCardDetails
} from '@/api/index.js';
export default { export default {
name: 'Details', name: 'Details',
components: { components: {
...@@ -37,22 +47,99 @@ export default { ...@@ -37,22 +47,99 @@ export default {
}, },
data() { data() {
return { return {
id: null,
showBtn: true
}; };
}, },
mounted(){ mounted(){
this.id = this.$route.query.id;
window.onmessage = e => {
if(e.data.type == 'saveFileSignalXml') {
MessageBox.confirm('确定保存文件?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
customClass: 'messageClass',
confirmButtonClass: 'confirmClass',
type: 'warning'
}).then(() => {
const params = {
viewDetailsId: this.id,
metaModelData: e.data.data.mxGraphModel,
metaModelSvg: e.data.data.base64SvgToString
}
saveArchiViewManageCardDetails(params).then(res => {
if(res.code == 200) {
Message({
type: 'success',
message: '保存成功!',
});
}else {
Message({
type: 'error',
message: res.msg
});
}
})
}).catch(() => {
Message({
type: 'info',
message: '已取消'
});
});
}
}
}, },
methods: { methods: {
saveFile() {
document.getElementById("drawioGraph").contentWindow.postMessage({ type: 'saveFileSignal' } , '*');
},
backGraph() {//返回上级图形
document.getElementById("drawioGraph").contentWindow.postMessage({ type: 'backGraph' } , '*');
},
releaseVersion() {//保存版本
MessageBox.confirm('确定发布版本?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
customClass: 'messageClass',
confirmButtonClass: 'confirmClass',
type: 'warning'
}).then(() => {
const params = {
viewDetailsId: this.id,
}
saveVersionArchiViewManageCardDetails(params).then(res => {
if(res.code == 200) {
Message({
type: 'success',
message: '版本发布成功!',
});
}else {
Message({
type: 'error',
message: res.msg
});
}
})
}).catch(() => {
Message({
type: 'info',
message: '已取消'
});
});
},
tabs_click_func(data) { tabs_click_func(data) {
switch(data.index){ switch(data.index){
case '0': case '0':
this.showBtn = true;
console.log('画布页面') console.log('画布页面')
break; break;
case '1': case '1':
this.showBtn = false;
this.$refs.tableComponent.get_table(); this.$refs.tableComponent.get_table();
break; break;
case '2': case '2':
this.showBtn = false;
console.log('导图页面') console.log('导图页面')
break; break;
} }
...@@ -66,6 +153,27 @@ export default { ...@@ -66,6 +153,27 @@ export default {
height: 100%; height: 100%;
position: relative; position: relative;
} }
.backPrevGraphbtn{
position: absolute;
right: 360px;
top: 0px;
z-index: 9;
color: #0D867F;
}
.versionBtn{
position: absolute;
right: 265px;
top: 0px;
z-index: 9;
color: #0D867F;
}
.saveFileBtn{
position: absolute;
right: 200px;
top: 0px;
z-index: 9;
color: #0D867F;
}
/deep/ .el-tabs__nav{ /deep/ .el-tabs__nav{
float: right; float: right;
} }
......
...@@ -195,7 +195,8 @@ export default { ...@@ -195,7 +195,8 @@ export default {
{ required: true, message: '请输入版本名称', trigger: 'blur' }, { required: true, message: '请输入版本名称', trigger: 'blur' },
], ],
}, },
addStatus: null addStatus: null,
graphGroup: null,
}; };
}, },
mounted(){ mounted(){
...@@ -238,26 +239,6 @@ export default { ...@@ -238,26 +239,6 @@ export default {
}) })
}); });
}, },
to_current_details(item) {//跳转到详情
const params = {
viewDetailsId: item.viewDetailsId
}
queryArchiViewManageCardDetails(params).then(res => {
if(res.code == 200) {
const xmlData = res.data.metaModelData;
const xmlTitle = res.data.verName;
const id = res.data.viewDetailsId;
localStorage.setItem('xmlData', xmlData);
localStorage.setItem('xmlTitle', xmlTitle);
Promise.all([ this.queryDrawioGraph(id), this.queryDrawioGraph2(id) ]).then(res2 => {
localStorage.setItem('commonGraph', JSON.stringify(res2[0].dataEle));
localStorage.setItem('standardGraph', JSON.stringify(res2[1].dataEle));
this.$router.push( `/main/archiViewManageDetails/id=${id}`, () => {}, () => {} );
});
}
});
},
deleteItem(item) {//删除 deleteItem(item) {//删除
MessageBox.confirm('确定删除?', '提示', { MessageBox.confirm('确定删除?', '提示', {
confirmButtonText: '确定', confirmButtonText: '确定',
...@@ -442,8 +423,29 @@ export default { ...@@ -442,8 +423,29 @@ export default {
} }
}) })
}, },
treeClick(data) {//树点击的时候 to_current_details(item) {//跳转到详情
const params = {
viewDetailsId: item.viewDetailsId
}
queryArchiViewManageCardDetails(params).then(res => {
if(res.code == 200) {
const xmlData = res.data.metaModelData;
const xmlTitle = res.data.version;
const id = res.data.viewDetailsId;
localStorage.setItem('xmlData', xmlData);
localStorage.setItem('xmlTitle', xmlTitle);
Promise.all([ this.queryDrawioGraph(id), this.queryDrawioGraph2(id) ]).then(res2 => {
localStorage.setItem('commonGraph', JSON.stringify({ show: true, graph: res2[0].dataEle }));
localStorage.setItem('standardGraph', JSON.stringify({ show: false, graph: res2[1].dataEle }));
this.$router.push( `/main/archiViewManageDetails?id=${id}&info=${this.graphGroup}`, () => {}, () => {} );
});
}
});
},
treeClick(data, node, e) {//树点击的时候
if(!data.subList) { if(!data.subList) {
this.graphGroup = node.parent.data.viewId;
this.viewId = data.viewId; this.viewId = data.viewId;
this.pager1.current = 1; this.pager1.current = 1;
this.pager2.current = 1; this.pager2.current = 1;
...@@ -467,6 +469,7 @@ export default { ...@@ -467,6 +469,7 @@ export default {
} }
getArchiViewManage(params).then(res => { getArchiViewManage(params).then(res => {
if(res.code == 200) { if(res.code == 200) {
this.graphGroup = res.data[0].viewId;
this.treeData[0].subList = res.data; this.treeData[0].subList = res.data;
this.treeDefaultExpand = [res.data[0].viewId]; this.treeDefaultExpand = [res.data[0].viewId];
this.currentNodekey = res.data[0].subList[0].viewId; this.currentNodekey = res.data[0].subList[0].viewId;
......
...@@ -24,8 +24,9 @@ export default { ...@@ -24,8 +24,9 @@ export default {
} }
}, },
mounted(){ mounted(){
this.id = window.location.href.split("id=")[1].split("&")[0]; this.id = this.$route.query.id;
// this.getMindData();
this.getMindData();
// var mind = { // var mind = {
// /* 元数据,定义思维导图的名称、作者、版本等信息 */ // /* 元数据,定义思维导图的名称、作者、版本等信息 */
...@@ -53,12 +54,16 @@ export default { ...@@ -53,12 +54,16 @@ export default {
// this.jm = new jsMind(options); // this.jm = new jsMind(options);
// this.jm.show(mind); // this.jm.show(mind);
// console.log(this.jm.get_data()) // console.log(this.jm.get_data())
this.getMindData();
}, },
methods: { methods: {
setExpanded(data) {
data.map(item => {
if(!item.children) return;
item.expanded = true;
this.setExpanded(item.children);
})
},
getMindData() {//获取思维导图数据 getMindData() {//获取思维导图数据
const params = { const params = {
viewDetailsId: this.id viewDetailsId: this.id
...@@ -66,30 +71,31 @@ export default { ...@@ -66,30 +71,31 @@ export default {
queryMindData(params).then(res => { queryMindData(params).then(res => {
if(res.code == 200) { if(res.code == 200) {
if(res.data.length > 0) { if(res.data.length > 0) {
res.data.map((item, index) => { this.setExpanded(res.data);
// item['id'] = String(index); const mindData = {
var mind = { "id":"root",
"meta":{ "topic": localStorage.getItem("xmlTitle"),
"name":"jsMind-demo-tree", "children": res.data
"author":"hizzgdev@163.com", }
"version":"0.2" var mind = {
}, "meta":{
/* 数据格式声明 */ "name": localStorage.getItem("xmlTitle"),
"format":"node_tree", "version":"0.1"
// data: {width: 400, ...item} },
data: item /* 数据格式声明 */
} "format":"node_tree",
console.log(mind); // data: {width: 400, ...item}
var options = { data: mindData
container:'jsmind_container', }
editable: true, var options = {
theme:'greensea', container:'jsmind_container',
support_html : true, editable: false,
}; theme:'greensea',
support_html : true,
};
this.jm = new jsMind(options); this.jm = new jsMind(options);
this.jm.show(mind); this.jm.show(mind);
})
} }
} }
}) })
...@@ -159,5 +165,6 @@ export default { ...@@ -159,5 +165,6 @@ export default {
background-color: #eee; background-color: #eee;
padding: 10px 0 10px 0; padding: 10px 0 10px 0;
text-align: right; text-align: right;
display: none;
} }
</style> </style>
\ No newline at end of file
...@@ -39,7 +39,8 @@ export default { ...@@ -39,7 +39,8 @@ export default {
}; };
}, },
mounted(){ mounted(){
this.routerId = window.location.href.split("id=")[1].split("&")[0]; this.routerId = this.$route.query.id;
}, },
methods: { methods: {
get_table() { get_table() {
......
...@@ -408,7 +408,7 @@ ...@@ -408,7 +408,7 @@
assetId: this.is_add_edit == 'add' ? null : this.editId, assetId: this.is_add_edit == 'add' ? null : this.editId,
parentAssetId: this.selectValue, parentAssetId: this.selectValue,
parentAssetName: this.selectLabel, parentAssetName: this.selectLabel,
isShow: this.ruleForm.let5 == '显示' ? 1 : 0, isShow: this.ruleForm.let5 == '显示' ? 0 : 1,
fieldsValue: fieldsValue, fieldsValue: fieldsValue,
targetAsset: targetAsset, targetAsset: targetAsset,
assetCode: this.selectCode, assetCode: this.selectCode,
...@@ -546,7 +546,7 @@ ...@@ -546,7 +546,7 @@
this.ruleForm.let2 = row.parentAssetName; this.ruleForm.let2 = row.parentAssetName;
this.ruleForm.let3 = row.archiEleId; this.ruleForm.let3 = row.archiEleId;
this.ruleForm.let4 = row.sort; this.ruleForm.let4 = row.sort;
this.ruleForm.let5 = row.isShow == 1 ? '显示' : '隐藏'; this.ruleForm.let5 = row.isShow == 0 ? '显示' : '隐藏';
this.editId = row.assetId; this.editId = row.assetId;
let fieldsValue = row.fieldsValue; let fieldsValue = row.fieldsValue;
let targetAsset = row.targetAsset; let targetAsset = row.targetAsset;
......
...@@ -408,7 +408,7 @@ ...@@ -408,7 +408,7 @@
assetId: this.is_add_edit == 'add' ? null : this.editId, assetId: this.is_add_edit == 'add' ? null : this.editId,
parentAssetId: this.selectValue, parentAssetId: this.selectValue,
parentAssetName: this.selectLabel, parentAssetName: this.selectLabel,
isShow: this.ruleForm.let5 == '显示' ? 1 : 0, isShow: this.ruleForm.let5 == '显示' ? 0 : 1,
fieldsValue: fieldsValue, fieldsValue: fieldsValue,
targetAsset: targetAsset, targetAsset: targetAsset,
assetCode: this.selectCode, assetCode: this.selectCode,
...@@ -546,7 +546,7 @@ ...@@ -546,7 +546,7 @@
this.ruleForm.let2 = row.parentAssetName; this.ruleForm.let2 = row.parentAssetName;
this.ruleForm.let3 = row.archiEleId; this.ruleForm.let3 = row.archiEleId;
this.ruleForm.let4 = row.sort; this.ruleForm.let4 = row.sort;
this.ruleForm.let5 = row.isShow == 1 ? '显示' : '隐藏'; this.ruleForm.let5 = row.isShow == 0 ? '显示' : '隐藏';
this.editId = row.assetId; this.editId = row.assetId;
let fieldsValue = row.fieldsValue; let fieldsValue = row.fieldsValue;
let targetAsset = row.targetAsset; let targetAsset = row.targetAsset;
......
...@@ -71,47 +71,48 @@ ...@@ -71,47 +71,48 @@
}, },
mounted(){ mounted(){
this.get_search_select1(); this.get_search_select1();
const id = this.$route.query.id;
const version = this.$route.query.info;
const id = window.location.href.split("id=")[1].split("&")[0];
const version = window.location.href.split("id=")[1].split("&")[1].split("=")[1];
this.routerId = { this.routerId = {
id, id: id,
info: version
} }
window.onmessage = e => { window.onmessage = e => {
if(e.data.type == 'saveData') { // if(e.data.type == 'saveData') {
MessageBox.confirm('确定保存?', '提示', { // MessageBox.confirm('确定保存文件?', '提示', {
confirmButtonText: '确定', // confirmButtonText: '确定',
cancelButtonText: '取消', // cancelButtonText: '取消',
customClass: 'messageClass', // customClass: 'messageClass',
confirmButtonClass: 'confirmClass', // confirmButtonClass: 'confirmClass',
type: 'warning' // type: 'warning'
}).then(() => { // }).then(() => {
this.saveCanvas(id, e.data.data.mxGraphModel, e.data.data.base64SvgToString); // this.saveCanvas(id, e.data.data.mxGraphModel, e.data.data.base64SvgToString);
}).catch(() => { // }).catch(() => {
Message({ // Message({
type: 'info', // type: 'info',
message: '已取消' // message: '已取消'
}); // });
}); // });
} // }
if(e.data.type == 'saveVersion'){ // if(e.data.type == 'saveVersion'){
MessageBox.confirm('确定发布版本?', '提示', { // MessageBox.confirm('确定发布版本?', '提示', {
confirmButtonText: '确定', // confirmButtonText: '确定',
cancelButtonText: '取消', // cancelButtonText: '取消',
customClass: 'messageClass', // customClass: 'messageClass',
confirmButtonClass: 'confirmClass', // confirmButtonClass: 'confirmClass',
type: 'warning' // type: 'warning'
}).then(() => { // }).then(() => {
this.releaseVersion(id, version); // this.releaseVersion(id, version);
}).catch(() => { // }).catch(() => {
Message({ // Message({
type: 'info', // type: 'info',
message: '已取消' // message: '已取消'
}); // });
}); // });
} // }
if(e.data.type == 'saveProperty'){ if(e.data.type == 'saveProperty'){
this.saveAttribute(e.data.data); this.saveAttribute(e.data.data);
...@@ -131,7 +132,7 @@ ...@@ -131,7 +132,7 @@
this.graphList = res.eleDtos; this.graphList = res.eleDtos;
}, },
get_search_select1() {//查询架构归属下拉框值 get_search_select1() {//查询架构归属下拉框值
const commonGraph = JSON.parse(localStorage.getItem("commonGraph")); const commonGraph = JSON.parse(localStorage.getItem("commonGraph")).graph;
commonGraph.reverse(); commonGraph.reverse();
this.search_select1 = commonGraph; this.search_select1 = commonGraph;
}, },
...@@ -191,46 +192,46 @@ ...@@ -191,46 +192,46 @@
} }
}); });
}, },
saveCanvas(id, mxGraphModel, base64SvgToString) {//保存文件 // saveCanvas(id, mxGraphModel, base64SvgToString) {//保存文件
const params = { // const params = {
metaModelId: id, // metaModelId: id,
metaModelData: mxGraphModel, // metaModelData: mxGraphModel,
metaModelSvg: base64SvgToString // metaModelSvg: base64SvgToString
} // }
save_drawio_xml_and_svg(params).then(res => { // save_drawio_xml_and_svg(params).then(res => {
if(res.code == 200) { // if(res.code == 200) {
Message({ // Message({
type: 'success', // type: 'success',
message: '保存成功!', // message: '保存成功!',
}); // });
}else { // }else {
Message({ // Message({
type: 'error', // type: 'error',
message: res.msg // message: res.msg
}); // });
} // }
}) // })
}, // },
releaseVersion(id, version) {//版本发布 // releaseVersion(id, version) {//版本发布
const params = { // const params = {
metaModelId: id, // metaModelId: id,
version: version, // version: version,
state: 1 // state: 1
} // }
save_drawio_version(params).then(res => { // save_drawio_version(params).then(res => {
if(res.code == 200) { // if(res.code == 200) {
Message({ // Message({
type: 'success', // type: 'success',
message: '版本发布成功!', // message: '版本发布成功!',
}); // });
}else { // }else {
Message({ // Message({
type: 'error', // type: 'error',
message: res.msg // message: res.msg
}); // });
} // }
}) // })
} // }
} }
} }
</script> </script>
......
<template> <template>
<div class="Details"> <div class="Details">
<el-select class="select_version_control" v-model="select_version" placeholder="请选择"> <!-- <el-select class="select_version_control" v-model="select_version" placeholder="请选择">
<el-option label="版本1" value="版本1"></el-option> <el-option label="版本1" value="版本1"></el-option>
</el-select> </el-select> -->
<template v-if="showBtn">
<el-button type="text" class="backPrevGraphbtn" @click="backGraph">返回上级图形</el-button>
<el-button type="text" class="versionBtn" @click="releaseVersion">版本发布</el-button>
<el-button type="text" class="saveFileBtn" @click="saveFile">保存</el-button>
</template>
<el-tabs type="border-card" @tab-click="tabs_click_func"> <el-tabs type="border-card" @tab-click="tabs_click_func">
<el-tab-pane> <el-tab-pane>
<span slot="label"> <span slot="label">
...@@ -16,12 +23,12 @@ ...@@ -16,12 +23,12 @@
</span> </span>
<Tables ref="tableComponent"></Tables> <Tables ref="tableComponent"></Tables>
</el-tab-pane> </el-tab-pane>
<el-tab-pane> <!-- <el-tab-pane>
<span slot="label"> <span slot="label">
<i class="el-icon-share"></i> <i class="el-icon-share"></i>
</span> </span>
<Mind></Mind> <Mind></Mind>
</el-tab-pane> </el-tab-pane> -->
</el-tabs> </el-tabs>
</div> </div>
</template> </template>
...@@ -30,7 +37,11 @@ ...@@ -30,7 +37,11 @@
import Graph from './canvas/index.vue'; import Graph from './canvas/index.vue';
import Tables from './table/index.vue'; import Tables from './table/index.vue';
import Mind from './mind/index.vue'; import Mind from './mind/index.vue';
import { MessageBox, Message } from 'element-ui';
import {
save_drawio_version,
save_drawio_xml_and_svg
} from '@/api/index.js';
export default { export default {
name: 'Details', name: 'Details',
components: { components: {
...@@ -40,22 +51,104 @@ export default { ...@@ -40,22 +51,104 @@ export default {
}, },
data() { data() {
return { return {
select_version: null select_version: null,
id: null,
version: null,
showBtn: true
}; };
}, },
mounted(){ mounted(){
this.id = this.$route.query.id;
this.version = this.$route.query.info;
window.onmessage = e => {
if(e.data.type == 'saveFileSignalXml') {
MessageBox.confirm('确定保存文件?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
customClass: 'messageClass',
confirmButtonClass: 'confirmClass',
type: 'warning'
}).then(() => {
const params = {
metaModelId: this.id,
metaModelData: e.data.data.mxGraphModel,
metaModelSvg: e.data.data.base64SvgToString
}
save_drawio_xml_and_svg(params).then(res => {
if(res.code == 200) {
Message({
type: 'success',
message: '保存成功!',
});
}else {
Message({
type: 'error',
message: res.msg
});
}
})
}).catch(() => {
Message({
type: 'info',
message: '已取消'
});
});
}
}
}, },
methods: { methods: {
saveFile() {
document.getElementById("drawioGraph").contentWindow.postMessage({ type: 'saveFileSignal' } , '*');
},
backGraph() {
document.getElementById("drawioGraph").contentWindow.postMessage({ type: 'backGraph' } , '*');
},
releaseVersion() {
MessageBox.confirm('确定发布版本?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
customClass: 'messageClass',
confirmButtonClass: 'confirmClass',
type: 'warning'
}).then(() => {
const params = {
metaModelId: this.id,
version: this.version,
state: 1
}
save_drawio_version(params).then(res => {
if(res.code == 200) {
Message({
type: 'success',
message: '版本发布成功!',
});
}else {
Message({
type: 'error',
message: res.msg
});
}
})
}).catch(() => {
Message({
type: 'info',
message: '已取消'
});
});
},
tabs_click_func(data) { tabs_click_func(data) {
switch(data.index){ switch(data.index){
case '0': case '0':
this.showBtn = true;
console.log('画布页面') console.log('画布页面')
break; break;
case '1': case '1':
this.showBtn = false;
this.$refs.tableComponent.get_table(); this.$refs.tableComponent.get_table();
break; break;
case '2': case '2':
this.showBtn = false;
console.log('导图页面') console.log('导图页面')
break; break;
} }
...@@ -69,6 +162,27 @@ export default { ...@@ -69,6 +162,27 @@ export default {
height: 100%; height: 100%;
position: relative; position: relative;
} }
.backPrevGraphbtn{
position: absolute;
right: 300px;
top: 0px;
z-index: 9;
color: #0D867F;
}
.versionBtn{
position: absolute;
right: 210px;
top: 0px;
z-index: 9;
color: #0D867F;
}
.saveFileBtn{
position: absolute;
right: 150px;
top: 0px;
z-index: 9;
color: #0D867F;
}
.select_version_control{ .select_version_control{
position: absolute; position: absolute;
top: 0; top: 0;
......
...@@ -281,7 +281,7 @@ export default { ...@@ -281,7 +281,7 @@ export default {
const version = res2.data.version; const version = res2.data.version;
localStorage.setItem('xmlData', xmlData); localStorage.setItem('xmlData', xmlData);
localStorage.setItem('xmlTitle', xmlTitle); localStorage.setItem('xmlTitle', xmlTitle);
this.$router.push( `/main/metaModelListDetails/id=${res.data}&version=${version}`, () => {}, () => {} ); this.$router.push( `/main/metaModelListDetails?id=${res.data}&info=${version}`, () => {}, () => {} );
} }
}); });
}else { }else {
...@@ -307,23 +307,10 @@ export default { ...@@ -307,23 +307,10 @@ export default {
localStorage.setItem('xmlData', xmlData); localStorage.setItem('xmlData', xmlData);
localStorage.setItem('xmlTitle', xmlTitle); localStorage.setItem('xmlTitle', xmlTitle);
Promise.all([ this.queryDrawioGraph(item.metaModelId), this.queryDrawioGraph2(item.metaModelId) ]).then(res2 => { Promise.all([ this.queryDrawioGraph(item.metaModelId), this.queryDrawioGraph2(item.metaModelId) ]).then(res2 => {
localStorage.setItem('commonGraph', JSON.stringify(res2[0].dataEle)); localStorage.setItem('commonGraph', JSON.stringify({ show: false, graph: res2[0].dataEle }));
localStorage.setItem('standardGraph', JSON.stringify(res2[1].dataEle)); localStorage.setItem('standardGraph', JSON.stringify({ show: true, graph: res2[1].dataEle }));
this.$router.push( `/main/metaModelListDetails/id=${item.metaModelId}&version=${item.version}`, () => {}, () => {} ); this.$router.push( `/main/metaModelListDetails?id=${item.metaModelId}&info=${item.version}`, () => {}, () => {} );
}); });
// this.queryDrawioGraph(item.metaModelId).then(res2 => {
// if(res2.code == 200) {
// res2.data.reverse();
// localStorage.setItem('commonGraph', JSON.stringify(res2.data));
// this.$router.push( `/main/metaModelListDetails/id=${item.metaModelId}&version=${item.version}`, () => {}, () => {} );
// }else {
// Message({
// type: 'error',
// message: res2.msg
// });
// }
// })
} }
}); });
}, },
......
...@@ -60,8 +60,8 @@ export default { ...@@ -60,8 +60,8 @@ export default {
}; };
this.jm = new jsMind(options); this.jm = new jsMind(options);
this.jm.show(mind); // this.jm.show(mind);
console.log(this.jm.get_data()) // console.log(this.jm.get_data())
}, },
methods: { methods: {
saveJsMind() { saveJsMind() {
......
...@@ -32,7 +32,7 @@ export default { ...@@ -32,7 +32,7 @@ export default {
}; };
}, },
mounted(){ mounted(){
this.routerId = window.location.href.split("id=")[1].split("&")[0]; this.routerId = this.$route.query.id;
// this.get_table(); // this.get_table();
}, },
methods: { methods: {
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!