Skip to content

liangzhen / framework-tools-web

Go to a project
Commit fe426ac4 by liuyong
Options

修改bug

1 parent 4f391983
Inline Side-by-side
Showing with 1252 additions and 167 deletions
public/drawio/extention/js/exApp(旧).js 0 → 100644
const initDrawioGraph = function(that) {//一进入画布显示的图形
const initDrawioGraph = function(that) {//一进入画布显示的图形
if(urlParams['id'] == 2) {
var mockFile = loadDiagram(urlParams['id'],'业务架构资产管理');
const file = new LocalFile(that, mockFile.data, mockFile.title, that.mode);
that.loadFile(`-2`, true, file);
}else {
const xmlData = localStorage.getItem('xmlData');
const xmlTitle = localStorage.getItem('xmlTitle');
const file = new LocalFile(that, xmlData, xmlTitle, that.mode);
that.loadFile(`-1`, true, file);
}
window.onmessage = e => {//监听vue页面的图形选择窗口给drawio画布传的属性传递
if(e.data.type == 'propertyReceive') {
const receiveData = e.data.data;
let eaLevel = receiveData.eaLevel;
let eleBelongId = receiveData.eleBelongId;
let dicys = JSON.stringify(receiveData.dicys);
that.editor.graph.getSelectionCells().forEach(item => {
if(item.value) {
if(that.editor.graph.getModel().isVertex(item)){
// console.log('封闭图形');
that.editor.graph.setCellStyles('attr', dicys, [item]);
that.editor.graph.setCellStyles('eleId', eleBelongId, [item]);
that.editor.graph.setCellStyles('eaLevel', eaLevel, [item]);
// console.log(item.style);
}else if (that.editor.graph.getModel().isEdge(item)) {
// console.log('线条')
}else {
// console.log('其他类型')
}
}
})
}
if(e.data.type == 'backGraph') {
const xml = localStorage.getItem('xmlData');
const mockFile = {
data: xml,
title: '原始数据'
};
that.editor.setStatus('');
that.fileLoaded(null);
that.spinner.stop();
const file = new LocalFile(that, mockFile.data, mockFile.title, null);
that.loadFile(`-3`, true, file);
}
if(e.data.type == 'saveFileSignal') {
var composedXMLData = Graph.xmlDeclaration +'\n' +that.getFileData(true, null, null, null, true, true, null, null, null, true);
var parser = new DOMParser();
var xmlDoc = parser.parseFromString(composedXMLData, "text/xml");
const mxGraphModel = xmlDoc.getElementsByTagName('diagram')[0].innerHTML;
var graph = that.editor.graph;
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 base64SvgToString = Base64.encode(svgToString);
window.parent.postMessage({ type: 'saveFileSignalXml', data: { mxGraphModel, base64SvgToString } }, '*');
}
// console.log(that.editor.graph.getSelectionCells());
// that.editor.graph.setCellStyles('property', '属性', [cells[0]]);//设置style里面拼接属性
// var style = that.editor.graph.getCurrentCellStyle(cells[0]);
// console.log(cells);
// console.log(style);
}
}
const setIcon = function (itemIcon, dicys, color) {
const item_icon = itemIcon.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];
const rectTag = svgDocument.getElementsByTagName('rect')[0];
const pathTag = svgDocument.getElementsByTagName('path')[0];
const ellipseTag = svgDocument.getElementsByTagName('ellipse')[0];
if(rectTag) {
if(color) {
rectTag.setAttribute('fill', color)
}
}
if(pathTag) {
if(color) {
pathTag.setAttribute('fill', color)
}
}
if(ellipseTag) {
if(color) {
ellipseTag.setAttribute('fill', color)
}
}
svgTag.style.backgroundColor = 'transparent';
// svgTag.setAttribute('a_123', 'a_123');
if(dicys && dicys.length > 0) {
dicys.forEach(function(item2) {
// svgTag.setAttribute(encodeURIComponent(item2.fieldName), encodeURIComponent(item2.chineseName));
if(item2.propertyValue) {
svgTag.setAttribute('attr_'+item2.fieldName, 'attr_'+Base64.encode(item2.propertyValue)+'&id=' + item2.propertyId);
}
})
}
const svgToString = new XMLSerializer().serializeToString(svgDocument);//svg标签转化为字符串
const encode_item_icon = (window.btoa)? btoa(svgToString) : Base64.encode(svgToString);//base64编码
icon = 'data:image/svg+xml;base64,' + encode_item_icon;
return { width, height, icon };
}
// const images_ = [
// {
// aspect: "fixed",
// data: "data:image/svg+xml;base64,PHN2ZyB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWw6c3BhY2U9InByZXNlcnZlIiB2aWV3Qm94PSIwIDAgMjU2IDI1NiIgeT0iMHB4IiB4PSIwcHgiIHZlcnNpb249IjEuMSI+JiN4YTsJPG1ldGFkYXRhPiYjeGE7CQlTdmcgVmVjdG9yIEljb25zIDogaHR0cDovL3d3dy5vbmxpbmV3ZWJmb250cy5jb20vaWNvbiYjeGE7CTwvbWV0YWRhdGE+JiN4YTsJPGc+JiN4YTsJCTxnPiYjeGE7CQkJPHBhdGggZD0iTTIxNS4zLDEwMS41bDEzLjksMjQuMWwtOTcuNSw1LjNsMjIuNSwzOWw0My41LDQuN2w4LDEzLjhsLTU3LjUsMjIuM0wxMDYuMiwyNDZsLTguMS0xNGwxNy45LTQwLjRsLTIyLTM4LjFsLTUzLjMsODEuN2wtMTMuOS0yNC4xbDM3LjgtMTA4LjVsLTM0LTU4LjhjLTYuMy0xMS0zLTI0LjgsNy41LTMwLjljMTAuNS02LDI0LjItMiwzMC41LDguOWwzMy42LDU4LjFMMjE1LjMsMTAxLjV6IE0yMTMuOCwxMTcuM2wtNC40LTcuNmwtMTEzLTIxLjZMNjAuOCwyNi4zYy0zLjgtNi42LTExLjktOS4xLTE4LTUuNnMtOCwxMS44LTQuMiwxOC40bDM2LjEsNjIuNEwzNi44LDIxMC4xbDQuNCw3LjZsNTMuMy04MS43bDMxLjgsNTUuMWwtMTcuOSw0MC40bDAuMywwLjVsMzQuNS0yOWwxLjMtMC42bDQ3LjktMTguNmwtMC40LTAuNmwtNDMuNS00LjdsLTMyLjMtNTUuOUwyMTMuOCwxMTcuM3oiIGZpbGw9IiMwMDAwMDAiLz4mI3hhOwkJPC9nPiYjeGE7CTwvZz4mI3hhOzwvc3ZnPg==",
// h: 256,
// title: "svg",
// w: 256
// }
// ];
// xml格式数据，压缩或者不压缩的都行
const images_ = [
{
aspect: "fixed",
xml: "tZTBUoMwEIafhisDpC30qG3Vg84404NHJ4UtZAwsExahPr0JhALWjnqQC/D9uyT7bxaHbfL2XvEye8IEpBN4SeuwrRMEfriI9M2QkyXLld+TVInEshHsxQdY6FlaiwSqWSAhShLlHMZYFBDTjHGlsJmHHVHOVy15ChdgH3N5SV9EQllPoyAc+QOINBtW9lfrXsn5EGwrqTKeYDNBbOewjUKk/ilvNyCNe4Mvfd7dFfW8MQUF/SYh6BPeuaxtbXZfdBqKVVgXCZh432G3TSYI9iWPjdro/mqWUS6tfBRSblCi6nKZ5/FDtDYcC5rwY3dpXpHCN5gowTZceZ5WdO+IiwIMN+92o6AI2qvF+mcL9eEDzIHUSYfYhIC54bJPasa2hYFrYTbp2cI2iNujkp6/NrqpH6yh35vLfjbX1CP0wXrkB5DPWAkSWGjpgESY67KHgBspUiMQfnFcn6DSfCxvUzNt7oFXInZ5XBO8khK8SM1at930ebrSf3E2WvQZdqAvTR4md2qx/3eL9es4G502+cWw3Sc=",
h: 430,
title: "我的图库",
w: 360
}
];
const leftCustomGraph = function(that) {//左侧自定义图形
// var xml = that.createLibraryDataFromImages(images_);
// var file = new LocalLibrary(that, xml, '图库');
// that.libraryLoaded(file, images_, null, false);
// const standardGraph = JSON.parse(localStorage.getItem('standardGraph'));
// standardGraph.forEach(function(item) {
// if(item.eleDtos) {
// if(item.eleDtos.length > 0) {
// const libraryName = item.arciBelongName;
// let images = [];
// item.eleDtos.forEach(function(item2) {
// if(item2.icon) {
// if(item2.icon.includes('data')) {
// images.unshift({
// aspect: "fixed",
// data: setIcon(item2.icon, item2.dicys, item2.color).icon,
// h: setIcon(item2.icon, item2.dicys, item2.color).height,
// title: item2.eleName,
// w: setIcon(item2.icon, item2.dicys, item2.color).width
// })
// }
// }
// })
// var xml = that.createLibraryDataFromImages(images);
// var file = new LocalLibrary(that, xml, libraryName);
// that.libraryLoaded(file, images, null, false);
// // that.saveLibrary(libraryName, images, null, 'ajax', undefined, undefined, undefined);
// }else {
// const libraryName2 = item.arciBelongName;
// var xml = that.createLibraryDataFromImages([]);
// var file = new LocalLibrary(that, xml, libraryName2);
// that.libraryLoaded(file, []);
// // that.saveLibrary(libraryName2, [], null, 'ajax', undefined, undefined, undefined);
// }
// }
// })
const standardGraph_ = JSON.parse(localStorage.getItem('standardGraph'));
const standardGraph = standardGraph_.graph;
if(standardGraph_.show) {
standardGraph.pop();
standardGraph.forEach(function(item) {
if(item.eleDtos) {
if(item.eleDtos.length > 0) {
const libraryName = item.arciBelongName;
let images = [];
item.eleDtos.forEach(function(item2) {
images.unshift({
aspect: "fixed",
xml: item2.iconName,
h: 41,
title: item2.eleName,
w: 71
})
})
var xml = that.createLibraryDataFromImages(images);
var file = new LocalLibrary(that, xml, libraryName);
that.libraryLoaded(file, images, null, false);
// that.saveLibrary(libraryName, images, null, 'ajax', undefined, undefined, undefined);
}else {
// const libraryName2 = item.arciBelongName;
// var xml = that.createLibraryDataFromImages([]);
// var file = new LocalLibrary(that, xml, libraryName2);
// that.libraryLoaded(file, []);
// that.saveLibrary(libraryName2, [], null, 'ajax', undefined, undefined, undefined);
}
}
})
}
}
//二次开发，创建时不必先保存文件至本地，定义Dialogs.js文件里面的createTemporaryFile函数
const createTemporaryFile = function() {
App.prototype.createTemporaryFile = function(title, data, libs, mode, done, replace, folderId, tempFile, clibs) {
data = (data != null) ? data : this.emptyDiagramXml;
this.fileCreated(new LocalFile(this, data, title, false), libs, replace, done, clibs);
}
}
const setGraphDefault = function(that) {
that.toggleCompactMode(false);//二次开发，默认折叠
that.toggleShapesPanel(true);//二次开发，默认全屏，显示左侧图形面板
that.toggleFormatPanel(true);//二次开发，默认全屏，显示右侧样式和属性面板
}
//设置画布只能预览
const setGraphOnlyView = function(graph) {
// graph.selectAll(null, true);
// graph.getModel().beginUpdate();
// var cells = graph.getSelectionCells();
// var style = graph.getCurrentCellStyle(graph.getSelectionCell());
// var value = (mxUtils.getValue(style, mxConstants.STYLE_EDITABLE, 1)) == 1 ? 0 : 1;
// graph.setCellStyles(mxConstants.STYLE_MOVABLE, value, cells);
// graph.setCellStyles(mxConstants.STYLE_RESIZABLE, value, cells);
// graph.setCellStyles(mxConstants.STYLE_ROTATABLE, value, cells);
// graph.setCellStyles(mxConstants.STYLE_DELETABLE, value, cells);
// graph.setCellStyles(mxConstants.STYLE_EDITABLE, value, cells);
// graph.setCellStyles('locked', 1, cells);
// graph.setCellStyles('connectable', value, cells);
// graph.getModel().endUpdate();
// graph.setEnabled(false);
// graph.setCellsEditable(false);
// graph.setTooltips(false);
// graph.setCellsSelectable(false);
// graph.setConnectable(false);
// graph.setCellsMovable(false);
// graph.getCursorForCell = function(cell){//预览时鼠标悬浮到节点时，改变鼠标样式
// if (cell != null && cell.value != null && cell.vertex ==1 )
// {
// return 'pointer';
// }
// };
}
var exToolbar = function (toolbarContainer) {//版本发布按钮
// this.toggleElement = document.createElement('a');
// this.toggleElement.setAttribute('title', '版本发布');
// this.toggleElement.style.position = 'absolute';
// this.toggleElement.style.display = 'inline-block';
// this.toggleElement.style.width = '100px';
// this.toggleElement.style.height = '16px';
// this.toggleElement.style.color = '#666';
// this.toggleElement.style.top = '6px';
// this.toggleElement.style.right = '10px';
// this.toggleElement.style.padding = '2px';
// this.toggleElement.style.fontSize = '14px';
// this.toggleElement.style.textDecoration = 'none';
// this.toggleElement.text = '版本发布';
// this.toggleElement.style.marginRight = '100px';
// this.toggleElement.style.cursor = 'pointer';
// this.toggleElement.style.color = 'rgb(13,134,127)';
// this.toggleElement.style.backgroundPosition = '50% 50%';
// this.toggleElement.style.backgroundRepeat = 'no-repeat';
// // Prevents focus
// mxEvent.addListener(this.toggleElement, (mxClient.IS_POINTER) ? 'pointerdown' : 'mousedown',
// mxUtils.bind(this, function (evt) {
// evt.preventDefault();
// }));
// // Toggles compact mode
// mxEvent.addListener(this.toggleElement, 'click', mxUtils.bind(this, function (evt) {
// window.parent.postMessage({ type: 'saveVersion' }, '*');
// }));
// if (Editor.currentTheme != 'atlas') {
// toolbarContainer.appendChild(this.toggleElement);
// }
// // Enable compact mode for small screens except for Firefox where the height is wrong
// if (!mxClient.IS_FF && screen.height <= 740 && typeof this.toggleElement.click !== 'undefined') {
// window.setTimeout(mxUtils.bind(this, function () {
// this.toggleElement.click();
// }), 0);
// }
}
var backGraph = function (that, toolbarContainer) {//返回上级图形按钮
// this.toggleElement = document.createElement('a');
// this.toggleElement.setAttribute('title', '返回上级图形');
// this.toggleElement.style.position = 'absolute';
// this.toggleElement.style.display = 'inline-block';
// this.toggleElement.style.width = '100px';
// this.toggleElement.style.height = '16px';
// this.toggleElement.style.color = '#666';
// this.toggleElement.style.top = '6px';
// this.toggleElement.style.right = '150px';
// this.toggleElement.style.padding = '2px';
// this.toggleElement.style.fontSize = '14px';
// this.toggleElement.style.textDecoration = 'none';
// this.toggleElement.text = '返回上级图形';
// this.toggleElement.style.marginRight = '100px';
// this.toggleElement.style.cursor = 'pointer';
// this.toggleElement.style.color = 'rgb(13,134,127)';
// this.toggleElement.style.backgroundPosition = '50% 50%';
// this.toggleElement.style.backgroundRepeat = 'no-repeat';
// // Toggles compact mode
// mxEvent.addListener(this.toggleElement, 'click', mxUtils.bind(this, function (evt) {
// console.log('上级图形');
// const xml = localStorage.getItem('xmlData');
// const mockFile = {
// data: xml,
// title: '原始数据'
// };
// that.editor.setStatus('');
// that.fileLoaded(null);
// that.spinner.stop();
// const file = new LocalFile(that, mockFile.data, mockFile.title, null);
// that.loadFile(`-3`, true, file);
// }));
// if (Editor.currentTheme != 'atlas') {
// toolbarContainer.appendChild(this.toggleElement);
// }
}
\ No newline at end of file
public/drawio/extention/js/exApp.js
......@@ -208,15 +208,8 @@ const leftCustomGraph = function(that) {//左侧自定义图形
var file = new LocalLibrary(that, xml, libraryName);
that.libraryLoaded(file, images, null, false);
// that.saveLibrary(libraryName, images, null, 'ajax', undefined, undefined, undefined);
}else {
// const libraryName2 = item.arciBelongName;
// var xml = that.createLibraryDataFromImages([]);
// var file = new LocalLibrary(that, xml, libraryName2);
// that.libraryLoaded(file, []);
// that.saveLibrary(libraryName2, [], null, 'ajax', undefined, undefined, undefined);
}
}
})
......
public/drawio/extention/js/exGraph(旧).js 0 → 100644
/**
/**
* 动态获取架构设计的分层归属信息（业务架构、应用架构、数据架构、技术架构、安全架构等信息）
* 该方法可以将归属信息、元素信息带出
*/
// (function()// 旧代码--------------------------------------------------------------
// {
// Sidebar.prototype.addCustomGraph = 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()
{
Sidebar.prototype.addCustomGraph = function()
{
const commonGraph_ = JSON.parse(localStorage.getItem('commonGraph'));
if(commonGraph_.show) {
const graphGroup = window.location.href.split("id=")[1].split("&")[1].split("=")[1];
const commonGraph = commonGraph_.graph.filter(item => item.arciBelongId == graphGroup);
this.sidebarTitles = true;//勾选标签
commonGraph.forEach(item => {
let fns = [];
item.eleDtos.forEach(item2 => {
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(
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, true, 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
src/api/index.js
......@@ -451,3 +451,7 @@ export function evoluteFunAndLineDeleteMore(params) {
export function evoluteFunAndLineAdd(params) {
return post('/network/arc-at-ev-road/ad', params);
}
// 架构视图左侧图元
export function queryArchiGraph(params) {
return post('/network/arc-ast-cn/assetTree', params);
}
\ No newline at end of file
src/views/Main/index.vue
......@@ -29,7 +29,7 @@
<div class="menu_container">
<el-popover
placement="bottom"
width="640"
width="440"
class="menu_item"
style="margin-right: 80px;cursor: pointer;position: relative;"
v-model="visible1"
......@@ -52,34 +52,36 @@
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">元模型管理</span>
</div>
<div class="menu_1_item_subtitle" @click="jumpPage('总体架构资产设计与维护', '架构元模型管理', '架构视图配置')">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">架构视图配置</span>
</div>
<div class="menu_1_item_subtitle" @click="jumpPage('总体架构资产设计与维护', '架构元模型管理', '元模型字典管理')">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">元模型字典管理</span>
</div>
</div>
<img class="menu_1_item_line" src="@/assets/main/line.png" alt="" />
<div class="menu_1_item">
<!-- <img class="menu_1_item_line" src="@/assets/main/line.png" alt="" /> -->
<!-- <div class="menu_1_item">
<div class="menu_1_item_title">
<img src="@/assets/main/2img.png" alt="">
<span style="margin-left: 5px;">架构视图管理</span>
</div>
<div class="menu_1_item_subtitle" @click="jumpPage('总体架构资产设计与维护', '架构视图管理', '架构视图配置')">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">架构视图配置</span>
</div>
<div class="menu_1_item_subtitle" @click="jumpPage('总体架构资产设计与维护', '架构视图管理', '架构视图管理')">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">架构视图管理</span>
</div>
</div>
</div> -->
<img class="menu_1_item_line" src="@/assets/main/line.png" alt="" />
<div class="menu_1_item">
<div class="menu_1_item_title">
<img src="@/assets/main/2img.png" alt="">
<span style="margin-left: 5px;">总体架构资产维护</span>
</div>
<div class="menu_1_item_subtitle" @click="jumpPage('总体架构资产设计与维护', '总体架构资产维护', '架构视图管理')">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">架构视图管理</span>
</div>
<div class="menu_1_item_subtitle" @click="jumpPage('总体架构资产设计与维护', '总体架构资产维护', '总体架构资产管理')">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">总体架构资产管理</span>
......@@ -105,18 +107,6 @@
<span style="margin-left: 5px;">总体架构资产智能搜索</span>
</div>
</div>
<img class="menu_1_item_line" src="@/assets/main/line.png" alt="" />
<div class="menu_1_item">
<div class="menu_1_item_title">
<img src="@/assets/main/2img.png" alt="">
<span style="margin-left: 5px;">系统架构资产维护</span>
</div>
<div class="menu_1_item_subtitle" @click="jumpPage('总体架构资产设计与维护', '系统架构资产维护', '系统架构资产维护')">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">系统架构资产维护</span>
</div>
</div>
</div>
<div slot="reference">
<img class="menu_icon" src="@/assets/main/1icon_default.png" alt="" />
......@@ -130,86 +120,51 @@
placement="bottom"
width="960"
class="menu_item"
v-model="visible2"
style="margin-right: 80px;cursor: pointer;position: relative;"
trigger="hover">
<div class="menu_1_container">
<div class="menu_1_item">
<div class="menu_1_item_title">
<img src="@/assets/main/2img.png" alt="">
<span style="margin-left: 5px;">系统架构图设计</span>
<span style="margin-left: 5px;">系统架构视图设计</span>
</div>
<div class="menu_1_item_subtitle">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">业务活动视图设计</span>
</div>
<div class="menu_1_item_subtitle">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">应用功能视图设计</span>
<span style="margin-left: 5px;">系统信息管理</span>
</div>
<div class="menu_1_item_subtitle">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">概念数据系统流转图设计</span>
<span style="margin-left: 5px;">项目信息管理</span>
</div>
<div class="menu_1_item_subtitle">
<div class="menu_1_item_subtitle" @click="jumpPage('系统架构设计与管控', '系统架构图设计', '系统架构资产维护')">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">关键技术选型视图设计</span>
<span style="margin-left: 5px;">系统架构资产维护</span>
</div>
<div class="menu_1_item_subtitle">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">网络安全布防视图设计</span>
<span style="margin-left: 5px;">系统架构视图设计</span>
</div>
</div>
<img class="menu_1_item_line" src="@/assets/main/line.png" alt="" />
<div class="menu_1_item">
<div class="menu_1_item_title">
<img src="@/assets/main/2img.png" alt="">
<span style="margin-left: 5px;">系统架构视图设计（概要设计)</span>
<span style="margin-left: 5px;">概设阶段架构设计</span>
</div>
<div class="menu_1_item_subtitle">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">业务活动视图设计</span>
</div>
<div class="menu_1_item_subtitle">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">应用功能视图设计</span>
</div>
<div class="menu_1_item_subtitle">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">数据模型及流转视图设计</span>
</div>
<div class="menu_1_item_subtitle">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">技术相关视图设计</span>
</div>
<div class="menu_1_item_subtitle">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">安全防护视图设计</span>
<span style="margin-left: 5px;">概设阶段架构设计</span>
</div>
<div class="menu_1_item_subtitle">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">其他视图设计</span>
</div>
</div>
<img class="menu_1_item_line" src="@/assets/main/line.png" alt="" />
<div class="menu_1_item">
<div class="menu_1_item_title">
<img src="@/assets/main/2img.png" alt="">
<span style="margin-left: 5px;">系统架构管控要求</span>
</div>
<div class="menu_1_item_subtitle">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">评审情况(概要设计)</span>
</div>
<div class="menu_1_item_subtitle">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">系统架构遵从检查</span>
</div>
<div class="menu_1_item_subtitle">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">系统架构政策审查</span>
<span style="margin-left: 5px;">系统架构管控要求(自查)</span>
</div>
</div>
<img class="menu_1_item_line" src="@/assets/main/line.png" alt="" />
......@@ -233,16 +188,12 @@
</div>
<div class="menu_1_item_subtitle">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">概设材料在线意见编制</span>
<span style="margin-left: 5px;">概设材料意见编制</span>
</div>
<div class="menu_1_item_subtitle">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">概设关联业务管理</span>
</div>
<div class="menu_1_item_subtitle">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">概设评审基础管理</span>
</div>
</div>
<img class="menu_1_item_line" src="@/assets/main/line.png" alt="" />
<div class="menu_1_item">
......@@ -257,7 +208,7 @@
</div>
<div class="menu_1_item_subtitle">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">架构督查材料收集</span>
<span style="margin-left: 5px;">督查材料收集</span>
</div>
<div class="menu_1_item_subtitle">
<img src="@/assets/main/3img.png" alt="">
......@@ -273,47 +224,16 @@
</div>
<div class="menu_1_item_subtitle">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">遵从检查</span>
<span style="margin-left: 5px;">架构遵从检查</span>
</div>
<div class="menu_1_item_subtitle">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">政策审查</span>
</div>
<span style="margin-left: 5px;">技术政策审查</span>
</div>
</div>
<div slot="reference">
<img class="menu_icon" src="@/assets/main/2icon_default.png" alt="" />
<img class="menu_icon_active" src="@/assets/main/2icon_press.png" alt="" />
<span class="menu_title">系统架构设计与管控</span>
<p class="under_line"></p>
</div>
</el-popover>
<el-popover
placement="bottom"
width="420"
class="menu_item"
style="margin-right: 80px;cursor: pointer;position: relative;"
trigger="hover">
<div class="menu_1_container">
<div class="menu_1_item">
<div class="menu_1_item_title">
<img src="@/assets/main/2img.png" alt="">
<span style="margin-left: 5px;">架构遵从符合度检查</span>
</div>
<div class="menu_1_item_subtitle">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">架构遵从符合度检查</span>
</div>
</div>
<img class="menu_1_item_line" src="@/assets/main/line.png" alt="" />
<div class="menu_1_item">
<div class="menu_1_item_title">
<img src="@/assets/main/2img.png" alt="">
<span style="margin-left: 5px;">技术政策符合度检查</span>
</div>
<div class="menu_1_item_subtitle">
<img src="@/assets/main/3img.png" alt="">
<span style="margin-left: 5px;">技术政策符合度检查</span>
......@@ -321,12 +241,11 @@
</div>
</div>
<div slot="reference">
<img class="menu_icon" src="@/assets/main/3icon_default.png" alt="" />
<img class="menu_icon_active" src="@/assets/main/3icon_press.png" alt="" />
<img class="menu_icon" src="@/assets/main/2icon_default.png" alt="" />
<img class="menu_icon_active" src="@/assets/main/2icon_press.png" alt="" />
<span class="menu_title">架构资产服务与辅助分析</span>
<span class="menu_title">系统架构设计与管控</span>
<p class="under_line"></p>
</div>
</el-popover>
<el-popover
......@@ -334,6 +253,7 @@
width="420"
class="menu_item"
style="margin-right: 80px;cursor: pointer;position: relative;"
v-model="visible3"
trigger="hover">
<div class="menu_1_container">
<div class="menu_1_item">
......@@ -384,8 +304,8 @@
</el-popover>
<el-popover
placement="bottom"
width="600"
v-model="visible5"
width="700"
v-model="visible4"
class="menu_item"
style="cursor: pointer;position: relative;"
trigger="hover">
......@@ -489,7 +409,9 @@
data() {
return {
visible1: false,
visible5: false,
visible2: false,
visible3: false,
visible4: false,
breadcrumb1: '总体架构资产设计与维护',
breadcrumb2: '架构元模型管理',
breadcrumb3: '架构元素管理',
......@@ -561,35 +483,35 @@
break;
case '技术政策结构化':
this.$router.push( '/main/techPoliticsFabric', () => {}, () => {} );
this.visible5 = false;
this.visible4 = false;
break;
case '技术政策库关联使用':
this.$router.push( '/main/techPoliticsRelativeUse', () => {}, () => {} );
this.visible5 = false;
this.visible4 = false;
break;
case '报告模板结构化':
this.$router.push( '/main/reportTemplateFabric', () => {}, () => {} );
this.visible5 = false;
this.visible4 = false;
break;
case '典型案例库管理':
this.$router.push( '/main/typicalExampleManage', () => {}, () => {} );
this.visible5 = false;
this.visible4 = false;
break;
case '典型案例库关联使用':
this.$router.push( '/main/typicalExampleRelativeUse', () => {}, () => {} );
this.visible5 = false;
this.visible4 = false;
break;
case '总体架构资产文档库':
this.$router.push( '/main/totalArchiPropertyDocument', () => {}, () => {} );
this.visible5 = false;
this.visible4 = false;
break;
case '专家人才库管理':
this.$router.push( '/main/etp-Manage', () => {}, () => {} );
this.visible5 = false;
this.visible4 = false;
break;
case '报告模板关联使用':
this.$router.push( '/main/reportTemplateRelativeUse', () => {}, () => {} );
this.visible5 = false;
this.visible4 = false;
break;
case '架构视图管理':
this.$router.push( '/main/archiViewManage', () => {}, () => {} );
......@@ -597,7 +519,7 @@
break;
case '系统架构资产维护':
this.$router.push( '/main/archiAssetManage', () => {}, () => {} );
this.visible1 = false;
this.visible2 = false;
break;
case '企业中台服务清单':
this.$router.push( '/main/comCenterServeList', () => {}, () => {} );
......
src/views/archi-ele-list/index.vue
......@@ -34,7 +34,7 @@
</div>
</div>
<div class="search_btn">
<div class="add_btn" @click="add">
<div class="add_btn" @click="addItem">
<img class="btn_icon" src="@/assets/archi-ele-list/create.png" alt="" />
<p>新建</p>
</div>
......@@ -51,11 +51,11 @@
<el-table-column prop="archiBelongName" label="架构归属" align="center"></el-table-column>
<el-table-column prop="eaLevel" label="元素层级" align="center"></el-table-column>
<el-table-column prop="content" label="描述" align="center" width="200" :show-overflow-tooltip="true"></el-table-column>
<el-table-column label="图标" align="center">
<!-- <el-table-column label="图标" align="center">
<template slot-scope="scope">
<img :src="scope.row.icon" alt="" :style="{ 'width': scope.row.width, 'height': scope.row.height }">
</template>
</el-table-column>
</el-table-column> -->
<el-table-column prop="version" label="版本" align="center"></el-table-column>
<el-table-column label="状态" align="center">
<template slot-scope="scope">
......@@ -96,10 +96,11 @@
:title="is_add_edit == 'add' ? '新建元素' : '编辑元素'"
:visible.sync="add_dialog"
:center="false"
class="dialog1"
:close-on-click-modal="false"
width="60%">
<div class="add_dialog_content">
<el-form :model="ruleForm" :rules="rules" ref="form">
<el-form :model="ruleForm" :rules="rules" ref="form" style="margin-bottom: 20px;">
<div class="form_item_container">
<el-form-item label="元素名称:" prop="let1">
<el-input v-no-backslash v-model="ruleForm.let1" maxlength="100"></el-input>
......@@ -176,6 +177,26 @@
</div>
</div>
</el-form>
<div style="text-align: right;margin-bottom: 10px;">
<el-button type="primary" size="mini" @click="openDicyDialog">新增</el-button>
</div>
<el-table height="300" :data="tableData2" stripe border>
<el-table-column type="index" label="序号" width="80" align="center"></el-table-column>
<el-table-column prop="fieldName" label="字段名" align="center"></el-table-column>
<el-table-column prop="cnName" label="中文名" align="center"></el-table-column>
<el-table-column prop="displayOrder" label="排序" align="center"></el-table-column>
<el-table-column prop="contentLength" label="长度" align="center"></el-table-column>
<el-table-column prop="controlType" label="控件" align="center"></el-table-column>
<el-table-column label="操作" width="260" align="center">
<template slot-scope="scope">
<div style="display: flex;align-items: center;justify-content: center;">
<el-button icon="el-icon-edit" type="primary" size="mini" @click="edit_dicy(scope.row)">编辑</el-button>
<el-button class="shanChu_btn" icon="el-icon-delete" size="mini" @click="delete_dicy(scope.row)">删除</el-button>
</div>
</template>
</el-table-column>
</el-table>
</div>
<span slot="footer" class="dialog-footer">
<el-button class="greenButton" v-debounce:click="release_dialog">发布</el-button>
......@@ -185,6 +206,56 @@
</el-dialog>
<el-dialog
:title="is_add_edit2 == 'add' ? '新增字典属性' : '编辑字典属性'"
:visible.sync="dicy_dialog"
:center="false"
:close-on-click-modal="false"
width="60%">
<el-form :model="ruleForm2" ref="form2" :rules="rules2" style="display: flex;flex-wrap: wrap;">
<el-form-item label="字段名:" prop="let1">
<el-input v-no-backslash v-model="ruleForm2.let1" maxlength="100"></el-input>
</el-form-item>
<el-form-item label="中文名:" prop="let2">
<el-input v-no-backslash v-model="ruleForm2.let2" maxlength="100"></el-input>
</el-form-item>
<el-form-item label="排序:" prop="let3">
<el-input-number style="width: 200px;" v-model="ruleForm2.let3" :min="0"></el-input-number>
</el-form-item>
<el-form-item label="长度:" prop="let4">
<el-input-number style="width: 200px;" v-model="ruleForm2.let4" :min="0"></el-input-number>
</el-form-item>
<el-form-item label="是否可以展示:" prop="let5">
<el-radio-group v-model="ruleForm2.let5">
<el-radio label="是"></el-radio>
<el-radio label="否"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="是否展示:" prop="let6">
<el-radio-group v-model="ruleForm2.let6">
<el-radio label="显示"></el-radio>
<el-radio label="不显示"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="控件:" prop="let7">
<el-select clearable placeholder="请选择" v-model="ruleForm2.let7">
<el-option label="单行文本框" value="0"></el-option>
<el-option label="多行文本框" value="1"></el-option>
<el-option label="下拉框" value="2"></el-option>
</el-select>
</el-form-item>
<el-form-item v-if="ruleForm2.let7 == 2" label="控件值:" prop="let8">
<el-select v-model="ruleForm2.let8" placeholder="请选择" clearable>
<el-option v-for="(item,idnex) in controlValueSelect" :key="idnex" :label="item.name" :value="item.typeValue"></el-option>
</el-select>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button class="greenButton" @click="save_dicy">保存</el-button>
<el-button @click="dicy_dialog = false">取消</el-button>
</span>
</el-dialog>
<el-dialog
title="选择图形"
:visible.sync="graph_dialog"
:center="false"
......@@ -249,7 +320,12 @@ import {
version_release_jia_gou_gui_shu,
edit_jia_gou_yuan_su,
query_jia_gou_gui_shu_belong_icon,
getDrawioLeftStandardGraph
getDrawioLeftStandardGraph,
getYMXZDGLProyList,
gAllDictKey,
getYMXZDGLProyAdd,
getYMXZDGLProyUpdate,
getYMXZDGLProyDel
} from '@/api/index.js';
import { MessageBox, Message } from 'element-ui';
import $ from 'jquery';
......@@ -264,6 +340,32 @@ export default {
standardGraph: [],
standardList: [],
graph_dialog: false,
controlValueSelect: [],
dicy_dialog: false,
ruleForm2: {
let1: null,
let2: null,
let3: 0,
let4: 0,
let5: '是',
let6: '显示',
let7: null,
let8: null,
},
rules2: {
let1: [
{ required: true, message: '请输入字段名', trigger: 'blur' },
],
let2: [
{ required: true, message: '请输入中文名', trigger: 'blur' },
],
let7: [
{ required: true, message: '请选择控件', trigger: 'change' },
],
},
is_add_edit2: 'add',
propertyId: null,
tableData2: [],
ruleForm: {
let1: null,
let2: null,
......@@ -318,7 +420,7 @@ export default {
graphIndex2: -1,
selectGraphSrc: '',
selectGraphShape: '',
tabType: '元模型图元'
tabType: '元模型图元',
};
},
mounted(){
......@@ -329,6 +431,160 @@ export default {
this.get_table();
},
methods: {
queryAllKey() {//查询控件右边的下拉框值
gAllDictKey().then(res => {
this.controlValueSelect = res.data;
})
},
edit_dicy(row){//编辑字典
this.dicy_dialog = true;
this.is_add_edit2 = 'edit';
this.queryAllKey();
this.propertyId = row.propertyId;
this.ruleForm2.let1 = row.fieldName;
this.ruleForm2.let2 = row.cnName;
this.ruleForm2.let3 = row.displayOrder;
this.ruleForm2.let4 = row.contentLength;
this.ruleForm2.let5 = row.notNull == '0' ? '是' : '否';
this.ruleForm2.let6 = row.isShow == '0' ? '显示' : '不显示';
this.ruleForm2.let7 = String(row.controlType);
this.ruleForm2.let8 = row.dictKey;
},
delete_dicy(row){//删除字典
MessageBox.confirm('确定删除?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
customClass: 'messageClass',
confirmButtonClass: 'confirmClass',
type: 'warning'
}).then(() => {
const params = {
propertyId: row.propertyId,
}
getYMXZDGLProyDel(params).then(res => {
if(res.code == 200) {
this.getDicyTable();
Message({
type: 'success',
message: '删除成功!'
});
}else{
Message({
type: 'error',
message: res.msg
});
}
});
}).catch(() => {
Message({
type: 'info',
message: '已取消'
});
});
},
openDicyDialog() {//打开字典窗口
this.dicy_dialog = true;
this.is_add_edit2 = 'add';
this.$nextTick(() => {
this.$refs.form2.resetFields();
this.ruleForm2.let1 = null;
this.ruleForm2.let2 = null;
this.ruleForm2.let3 = 0;
this.ruleForm2.let4 = 0;
this.ruleForm2.let5 = '是';
this.ruleForm2.let6 = '显示';
this.ruleForm2.let7 = null;
this.ruleForm2.let8 = null;
});
this.queryAllKey();
},
editItem(row) {//编辑
this.ruleForm.let1 = row.elementName;
this.ruleForm.let2 = row.archiLevelId;
this.ruleForm.let3 = row.archiBelongId;
this.ruleForm.let4 = row.content;
this.ruleForm.let5 = row.eaLevel;
this.ruleForm.let6 = row.color;
this.is_add_edit = 'edit';
this.elementId = row.elementId;
this.state = row.state;
this.version = row.version;
this.add_dialog = true;
this.selectGraphSrc = row.icon;
this.selectGraphShape = row.iconName;
this.$nextTick(() => {
this.$refs.form.clearValidate();
});
this.getDicyTable();
},
getDicyTable() {//字典表格
const params = {
type: 1,
typeId: this.elementId
}
getYMXZDGLProyList(params).then(res => {
if (res.code == 200) {
console.log(res.data)
this.tableData2 = res.data;
}
});
},
save_dicy() {//字典窗口保存
this.$refs.form2.validate(valid => {
if(valid) {
const params = {
fieldName: this.ruleForm2.let1,
cnName: this.ruleForm2.let2,
displayOrder: this.ruleForm2.let3,
contentLength: this.ruleForm2.let4,
controlType: this.ruleForm2.let7,
type: 1,
typeId: this.elementId,
dictKey: this.ruleForm2.let8,
notNull: this.ruleForm2.let5 == '是' ? 0 : 1,
isShow: this.ruleForm2.let6 == '显示' ? 0 : 1,
};
const requestParams = this.is_add_edit2 == 'add' ? params : { ...params, propertyId: this.propertyId };
if(this.is_add_edit2 == 'add') {
getYMXZDGLProyAdd(requestParams).then(res => {
if(res.code == 200) {
this.dicy_dialog = false;
this.getDicyTable();
Message({
type: 'success',
message: '保存成功!'
});
}else {
Message({
type: 'error',
message: res.msg
});
}
});
}else {
getYMXZDGLProyUpdate(requestParams).then(res => {
if (res.code == 200) {
this.dicy_dialog = false;
this.getDicyTable();
Message({
type: 'success',
message: '保存成功!'
});
}else{
Message({
type: 'error',
message: res.msg
});
}
});
}
}else {
return false;
}
});
},
openGraphDialog() {//打开图形选择窗口
this.graph_dialog = true;
this.showCurrentGraph(this.search_select1[0].name, 0);
......@@ -414,25 +670,6 @@ export default {
return true; //不禁用
}
},
editItem(row) {//编辑
this.ruleForm.let1 = row.elementName;
this.ruleForm.let2 = row.archiLevelId;
this.ruleForm.let3 = row.archiBelongId;
this.ruleForm.let4 = row.content;
this.ruleForm.let5 = row.eaLevel;
this.ruleForm.let6 = row.color;
this.is_add_edit = 'edit';
this.elementId = row.elementId;
this.state = row.state;
this.version = row.version;
this.add_dialog = true;
this.selectGraphSrc = row.icon;
this.selectGraphShape = row.iconName;
this.$nextTick(() => {
this.$refs.form.clearValidate();
});
},
version_release(){//版本发布
if(this.selectTable.length == 0) {
Message({
......@@ -614,7 +851,7 @@ export default {
}
});
},
add() {//新建按钮
addItem() {//新建按钮
this.add_dialog = true;
this.is_add_edit = 'add';
this.get_dialog_select1().then(res => {
......@@ -923,6 +1160,10 @@ export default {
text-align: center;
cursor: pointer;
}
/deep/ .dialog1 .el-dialog__body{
height: 55vh;
overflow-y: auto;
}
/deep/ .el-dialog__header{
background-color: #0D867F;
text-align: left;
......@@ -946,6 +1187,7 @@ export default {
}
.el-form-item{
display: flex;
align-items: center;
width: 33%;
}
/deep/ .el-dialog__title{
......
src/views/archi-view-manage/index.vue
......@@ -140,7 +140,8 @@ import {
deleteArchiViewManage,
queryArchiViewManageCardDetails,
getDrawioLeftCommonGraph,
getDrawioLeftStandardGraph
getDrawioLeftStandardGraph,
queryArchiGraph
} from '@/api/index.js';
import { MessageBox, Message } from 'element-ui';
import $ from 'jquery';
......@@ -437,12 +438,18 @@ export default {
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}`, () => {}, () => {} );
localStorage.setItem('standardGraph', JSON.stringify({ show: true, graph: res2[1].dataEle }));
});
}
});
},
queryArchiGraph() {//查询综合图
queryArchiGraph({}).then(res => {
console.log(res)
localStorage.setItem('joinGraph', JSON.stringify({ graph1: res2[1].dataEle, graph2: [] }));
})
},
treeClick(data, node, e) {//树点击的时候
if(!data.subList) {
this.graphGroup = node.parent.data.viewId;
......
src/views/archiEleRela/index.vue
......@@ -91,6 +91,7 @@
:title="title"
:visible.sync="add_dialog"
:center="false"
class="dialog1"
width="60%">
<div class="add_dialog_content">
<el-form :model="formData" :rules="rules" ref="relaForm">
......@@ -156,6 +157,25 @@
</div>
</div>
</div>
<div style="text-align: right;margin: 20px 0 10px 0;">
<el-button type="primary" size="mini" @click="openDicyDialog">新增</el-button>
</div>
<el-table height="300" :data="tableData2" stripe border>
<el-table-column type="index" label="序号" width="80" align="center"></el-table-column>
<el-table-column prop="fieldName" label="字段名" align="center"></el-table-column>
<el-table-column prop="cnName" label="中文名" align="center"></el-table-column>
<el-table-column prop="displayOrder" label="排序" align="center"></el-table-column>
<el-table-column prop="contentLength" label="长度" align="center"></el-table-column>
<el-table-column prop="controlType" label="控件" align="center"></el-table-column>
<el-table-column label="操作" width="260" align="center">
<template slot-scope="scope">
<div style="display: flex;align-items: center;justify-content: center;">
<el-button icon="el-icon-edit" type="primary" size="mini" @click="edit_dicy(scope.row)">编辑</el-button>
<el-button class="shanChu_btn" icon="el-icon-delete" size="mini" @click="delete_dicy(scope.row)">删除</el-button>
</div>
</template>
</el-table-column>
</el-table>
</div>
<span slot="footer" class="dialog-footer">
<el-button class="greenButton" @click="operate('pushAdd')">发布</el-button>
......@@ -165,6 +185,57 @@
</el-dialog>
<el-dialog
title="编辑字典属性"
:visible.sync="dicy_dialog"
:center="false"
:close-on-click-modal="false"
width="60%">
<el-form :model="ruleForm2" ref="form2" :rules="rules2" style="display: flex;flex-wrap: wrap;">
<el-form-item label="字段名:" prop="let1">
<el-input v-no-backslash v-model="ruleForm2.let1" maxlength="100" :rules="[
{ required: true, message: '请输入字段名', trigger: 'blur' },
]"></el-input>
</el-form-item>
<el-form-item label="中文名:" prop="let2">
<el-input v-no-backslash v-model="ruleForm2.let2" maxlength="100" :rules="[
{ required: true, message: '请输入中文名', trigger: 'blur' },
]"></el-input>
</el-form-item>
<el-form-item label="排序:" prop="let3">
<el-input-number style="width: 200px;" v-model="ruleForm2.let3" :min="0"></el-input-number>
</el-form-item>
<el-form-item label="长度:" prop="let4">
<el-input-number style="width: 200px;" v-model="ruleForm2.let4" :min="0"></el-input-number>
</el-form-item>
<el-form-item label="是否可以展示:" prop="let5">
<el-radio-group v-model="ruleForm2.let5">
<el-radio label="是"></el-radio>
<el-radio label="否"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="是否展示:" prop="let6">
<el-radio-group v-model="ruleForm2.let6">
<el-radio label="显示"></el-radio>
<el-radio label="不显示"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="控件:" prop="let7" :rules="[
{ required: true, message: '请选择控件', trigger: 'change' },
]">
<el-select clearable placeholder="请选择" v-model="ruleForm2.let7">
<el-option label="单行文本框" value="0"></el-option>
<el-option label="多行文本框" value="1"></el-option>
<el-option label="下拉框" value="2"></el-option>
</el-select>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button class="greenButton" @click="save_dicy">保存</el-button>
<el-button @click="dicy_dialog = false">取消</el-button>
</span>
</el-dialog>
<el-dialog
title="查看约束条件"
:visible.sync="add_dialog3"
:center="false"
......@@ -214,6 +285,28 @@ export default {
},
data() {
return {
dicy_dialog: false,
ruleForm2: {
let1: null,
let2: null,
let3: 0,
let4: 0,
let5: '是',
let6: '显示',
let7: null,
},
rules2: {
let1: [
{ required: true, message: '请输入字段名', trigger: 'blur' },
],
let2: [
{ required: true, message: '请输入中文名', trigger: 'blur' },
],
let7: [
{ required: true, message: '请选择控件', trigger: 'change' },
],
},
tableData2: [],
tableData: [],
selectList: [],
add_dialog: false,
......@@ -322,7 +415,7 @@ export default {
belongId: 0,
}
],
is_add_edit2: 'add'
};
},
mounted() {
......@@ -341,6 +434,35 @@ export default {
created() {
},
methods: {
edit_dicy(row){//编辑字典
this.is_add_edit2 = 'edit';
},
delete_dicy(row){//删除字典
},
openDicyDialog() {//打开字典窗口
this.dicy_dialog = true;
this.is_add_edit2 = 'add';
this.$nextTick(() => {
this.$refs.form2.resetFields();
this.ruleForm2.let1 = null;
this.ruleForm2.let2 = null;
this.ruleForm2.let3 = 0;
this.ruleForm2.let4 = 0;
this.ruleForm2.let5 = '是';
this.ruleForm2.let6 = '显示';
this.ruleForm2.let7 = null;
});
},
save_dicy() {//字典窗口保存
this.$refs.form2.validate(valid => {
if(valid) {
}else {
return false;
}
});
},
// 查询列表
getList() {
if (this.params.state != '') {
......@@ -708,6 +830,25 @@ export default {
}
}
}
.el-button--primary{
background: rgba(13,134,127,0.1);
color: #0D867F;
border: 0;
}
/deep/ .dialog1 .el-dialog__body{
height: 55vh;
overflow-y: auto;
}
/deep/ .el-dialog__header{
background-color: #0D867F;
text-align: left;
}
/deep/ .el-dialog__title{
color: #fff;
}
/deep/ .el-dialog__close {
color: #fff;
}
.search_menu{
display: flex;
justify-content: space-between;
......@@ -842,6 +983,11 @@ export default {
width: 100%;
}
}
.el-form-item{
display: flex;
align-items: center;
width: 33%;
}
.dialog_form_item{
display: flex;
align-items: center;
......
src/views/archiViewConfig/index.vue
......@@ -91,6 +91,7 @@
:title="title"
:visible.sync="add_dialog"
top="4%"
class="dialog1"
:center="false"
width="60%">
<div class="add_dialog_content">
......@@ -130,6 +131,27 @@
<el-table-column prop="rsName" label="元素关系名称" align="center"></el-table-column>
</el-table>
</div>
<div style="text-align: right;margin: 20px 0 10px 0;width: 96%;">
<el-button type="primary" size="mini" @click="openDicyDialog">新增</el-button>
</div>
<div class="dialog_form_item">
<el-table height="300" :data="tableData3" stripe border>
<el-table-column type="index" label="序号" width="80" align="center"></el-table-column>
<el-table-column prop="fieldName" label="字段名" align="center"></el-table-column>
<el-table-column prop="cnName" label="中文名" align="center"></el-table-column>
<el-table-column prop="displayOrder" label="排序" align="center"></el-table-column>
<el-table-column prop="contentLength" label="长度" align="center"></el-table-column>
<el-table-column prop="controlType" label="控件" align="center"></el-table-column>
<el-table-column label="操作" width="260" align="center">
<template slot-scope="scope">
<div style="display: flex;align-items: center;justify-content: center;">
<el-button icon="el-icon-edit" type="primary" size="mini" @click="edit_dicy(scope.row)">编辑</el-button>
<el-button class="shanChu_btn" icon="el-icon-delete" size="mini" @click="delete_dicy(scope.row)">删除</el-button>
</div>
</template>
</el-table-column>
</el-table>
</div>
</div>
<span slot="footer" class="dialog-footer">
<el-button class="greenButton" @click="operate('pushAdd')">发布</el-button>
......@@ -137,6 +159,61 @@
<el-button @click="add_dialog = false">取消</el-button>
</span>
</el-dialog>
<el-dialog
title="编辑字典属性"
:visible.sync="dicy_dialog"
:center="false"
:close-on-click-modal="false"
width="60%">
<el-form :model="ruleForm2" ref="form2" :rules="rules2" style="display: flex;flex-wrap: wrap;">
<el-form-item label="字段名:" prop="let1">
<el-input v-no-backslash v-model="ruleForm2.let1" maxlength="100" :rules="[
{ required: true, message: '请输入字段名', trigger: 'blur' },
]"></el-input>
</el-form-item>
<el-form-item label="中文名:" prop="let2">
<el-input v-no-backslash v-model="ruleForm2.let2" maxlength="100" :rules="[
{ required: true, message: '请输入中文名', trigger: 'blur' },
]"></el-input>
</el-form-item>
<el-form-item label="排序:" prop="let3">
<el-input-number style="width: 200px;" v-model="ruleForm2.let3" :min="0"></el-input-number>
</el-form-item>
<el-form-item label="长度:" prop="let4">
<el-input-number style="width: 200px;" v-model="ruleForm2.let4" :min="0"></el-input-number>
</el-form-item>
<el-form-item label="是否可以展示:" prop="let5">
<el-radio-group v-model="ruleForm2.let5">
<el-radio label="是"></el-radio>
<el-radio label="否"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="是否展示:" prop="let6">
<el-radio-group v-model="ruleForm2.let6">
<el-radio label="显示"></el-radio>
<el-radio label="不显示"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="控件:" prop="let7">
<el-select clearable placeholder="请选择" v-model="ruleForm2.let7">
<el-option label="单行文本框" value="0"></el-option>
<el-option label="多行文本框" value="1"></el-option>
<el-option label="下拉框" value="2"></el-option>
</el-select>
</el-form-item>
<el-form-item v-if="ruleForm2.let7 == 2" label="控件值:" prop="let8">
<el-select v-model="ruleForm2.let8" placeholder="请选择" clearable>
<el-option v-for="(item,idnex) in controlValueSelect" :key="idnex" :label="item.name" :value="item.typeValue"></el-option>
</el-select>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button class="greenButton" @click="save_dicy">保存</el-button>
<el-button @click="dicy_dialog = false">取消</el-button>
</span>
</el-dialog>
</div>
</template>
......@@ -153,7 +230,13 @@ import {
gtEleRelList,
query_jia_gou_gui_shu,
query_jia_gou_ceng_ci,
getYMXZDGLProyList,
gAllDictKey,
getYMXZDGLProyAdd,
getYMXZDGLProyUpdate,
getYMXZDGLProyDel
} from "@/api/index.js";
import { MessageBox, Message } from 'element-ui';
export default {
name: 'archiViewConfig',
......@@ -162,6 +245,33 @@ export default {
},
data() {
return {
dicy_dialog: false,
controlValueSelect: [],
is_add_edit2: 'add',
propertyId: null,
ruleForm2: {
let1: null,
let2: null,
let3: 0,
let4: 0,
let5: '是',
let6: '显示',
let7: null,
let8: null,
},
rules2: {
let1: [
{ required: true, message: '请输入字段名', trigger: 'blur' },
],
let2: [
{ required: true, message: '请输入中文名', trigger: 'blur' },
],
let7: [
{ required: true, message: '请选择控件', trigger: 'change' },
],
},
viewId: null,
tableData3: [],
tableData: [],
selectList: [],
add_dialog: false,
......@@ -244,6 +354,7 @@ export default {
selectData2: [],
selectData3: [],
selectData4: [],
};
},
mounted() {
......@@ -265,6 +376,139 @@ export default {
},
methods: {
queryAllKey() {//查询控件右边的下拉框值
gAllDictKey().then(res => {
this.controlValueSelect = res.data;
})
},
edit_dicy(row){//编辑字典
this.dicy_dialog = true;
this.is_add_edit2 = 'edit';
this.queryAllKey();
this.propertyId = row.propertyId;
this.ruleForm2.let1 = row.fieldName;
this.ruleForm2.let2 = row.cnName;
this.ruleForm2.let3 = row.displayOrder;
this.ruleForm2.let4 = row.contentLength;
this.ruleForm2.let5 = row.notNull == '0' ? '是' : '否';
this.ruleForm2.let6 = row.isShow == '0' ? '显示' : '不显示';
this.ruleForm2.let7 = String(row.controlType);
this.ruleForm2.let8 = row.dictKey;
},
delete_dicy(row){//删除字典
MessageBox.confirm('确定删除?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
customClass: 'messageClass',
confirmButtonClass: 'confirmClass',
type: 'warning'
}).then(() => {
const params = {
propertyId: row.propertyId,
}
getYMXZDGLProyDel(params).then(res => {
if(res.code == 200) {
this.getDicyTable();
Message({
type: 'success',
message: '删除成功!'
});
}else{
Message({
type: 'error',
message: res.msg
});
}
});
}).catch(() => {
Message({
type: 'info',
message: '已取消'
});
});
},
openDicyDialog() {//打开字典窗口
this.dicy_dialog = true;
this.is_add_edit2 = 'add';
this.$nextTick(() => {
this.$refs.form2.resetFields();
this.ruleForm2.let1 = null;
this.ruleForm2.let2 = null;
this.ruleForm2.let3 = 0;
this.ruleForm2.let4 = 0;
this.ruleForm2.let5 = '是';
this.ruleForm2.let6 = '显示';
this.ruleForm2.let7 = null;
this.ruleForm2.let8 = null;
});
this.queryAllKey();
},
save_dicy() {//字典窗口保存
this.$refs.form2.validate(valid => {
if(valid) {
const params = {
fieldName: this.ruleForm2.let1,
cnName: this.ruleForm2.let2,
displayOrder: this.ruleForm2.let3,
contentLength: this.ruleForm2.let4,
controlType: this.ruleForm2.let7,
type: 3,
typeId: this.viewId,
dictKey: this.ruleForm2.let8,
notNull: this.ruleForm2.let5 == '是' ? 0 : 1,
isShow: this.ruleForm2.let6 == '显示' ? 0 : 1,
};
const requestParams = this.is_add_edit2 == 'add' ? params : { ...params, propertyId: this.propertyId };
if(this.is_add_edit2 == 'add') {
getYMXZDGLProyAdd(requestParams).then(res => {
if(res.code == 200) {
this.dicy_dialog = false;
this.getDicyTable();
Message({
type: 'success',
message: '保存成功!'
});
}else {
Message({
type: 'error',
message: res.msg
});
}
});
}else {
getYMXZDGLProyUpdate(requestParams).then(res => {
if (res.code == 200) {
this.dicy_dialog = false;
this.getDicyTable();
Message({
type: 'success',
message: '保存成功!'
});
}else{
Message({
type: 'error',
message: res.msg
});
}
});
}
}else {
return false;
}
});
},
getDicyTable() {//字典表格
const params = {
type: 3,
typeId: this.viewId
}
getYMXZDGLProyList(params).then(res => {
if (res.code == 200) {
this.tableData3 = res.data;
}
});
},
// 获取下拉
getLevelList() {
query_jia_gou_ceng_ci().then(res => {
......@@ -359,6 +603,9 @@ export default {
this.title = "编辑架构视图";
this.resetForm();
this.viewId = item.viewId;
this.getDicyTable();
this.formData = item;
if (item.eleName) {
this.selectData1 = item.eleName.split(",");
......@@ -599,7 +846,29 @@ export default {
},
}
</script>
<style>
.confirmClass{
background-color: #0D867F !important;
}
.el-message-box__content{
padding: 60px 15px 60px 15px;
}
</style>
<style lang="scss" scoped>
.el-button--primary{
background: rgba(13,134,127,0.1);
color: #0D867F;
border: 0;
}
.el-form-item{
display: flex;
align-items: center;
width: 33%;
}
.shanChu_btn{
color: #DD6A15;
background-color: #F8EBE2;
}
.JiaGouYuanShuGuanLi{
width: 100%;
height: 100%;
......@@ -608,6 +877,20 @@ export default {
justify-content: flex-start;
align-items: center;
}
/deep/ .dialog1 .el-dialog__body{
height: 55vh;
overflow-y: auto;
}
/deep/ .el-dialog__header{
background-color: #0D867F;
text-align: left;
}
/deep/ .el-dialog__title{
color: #fff;
}
/deep/ .el-dialog__close {
color: #fff;
}
.form_item_container{
display: flex;
flex-wrap: wrap;
......
src/views/metaModelDic/pages/page1.vue
......@@ -601,19 +601,14 @@ export default {
this.$refs.page1Form.validate(valid => {
if(valid) {
if (this.formData2.propertyId) {
let params = {
fieldName: this.formData2.fieldName,
cnName: this.formData2.cnName,
displayOrder: this.formData2.displayOrder,
contentLength: this.formData2.contentLength,
controlType: this.formData2.controlType,
propertyId: this.formData2.propertyId,
type: this.formData.type,
typeId: this.formData.typeId,
version: this.formData.version,
dicyId: this.formData.dicyId,
state: this.formData.state,
dictKey: this.formData2.dictKey,
notNull: this.formData2.notNull,
isShow: this.formData2.isShow,
......@@ -639,9 +634,6 @@ export default {
controlType: this.formData2.controlType,
type: this.formData.type,
typeId: this.formData.typeId,
version: this.formData.version,
dicyId: this.formData.dicyId,
state: this.formData.state,
dictKey: this.formData2.dictKey,
notNull: this.formData2.notNull,
isShow: this.formData2.isShow,
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!