Commit 33c7466e by liuyong

修改bug

1 parent c173fecd
......@@ -121,32 +121,39 @@ const setIcon = function (itemIcon, dicys, color) {
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 svg = '<svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" style="left: 1px; top: 1px; width: 32px; height: 30px; display: block; position: relative; overflow: hidden; pointer-events: none;"><g style="pointer-events: none;"><g style="pointer-events: none;"></g><g style="pointer-events: none;"><g transform="translate(0.5,0.5)" style="visibility: visible; pointer-events: none;"><path d="M 2.48 27.98 L 28.99 1.48" fill="none" stroke="white" stroke-width="9.3" stroke-miterlimit="10" visibility="hidden" style="pointer-events: none;"></path><path d="M 2.48 27.98 L 28.99 1.48" fill="none" stroke="rgb(0, 0, 0)" stroke-width="1.3" stroke-miterlimit="10" stroke-dasharray="1.59 1.59" style="pointer-events: none;"></path></g></g><g style="pointer-events: none;"></g><g style="pointer-events: none;"></g></g></svg>';
const svg = '<svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" style="left: 1px; top: 1px; width: 32px; height: 30px; display: block; position: relative; overflow: hidden; pointer-events: none;"><g style="pointer-events: none;"><g style="pointer-events: none;"></g><g style="pointer-events: none;"><g transform="translate(0.5,0.5)" style="visibility: visible; pointer-events: none;"><path d="M 2.74 27.74 L 28.74 1.74" fill="none" stroke="white" stroke-width="9.3" stroke-miterlimit="10" visibility="hidden" style="pointer-events: none;"></path><path d="M 2.74 27.74 L 28.74 1.74" fill="none" stroke="rgb(0, 0, 0)" stroke-width="1.3" stroke-miterlimit="10" stroke-dasharray="1.04 3.12" style="pointer-events: none;"></path></g></g><g style="pointer-events: none;"></g><g style="pointer-events: none;"></g></g></svg>';
const encode_item_icon = window.btoa(svg);//base64编码
let svgImage= 'data:image/svg+xml;base64,'+ encode_item_icon;
console.log(svgImage)
const images_ = [
{
aspect: "fixed",
xml: "tZTBUoMwEIafhisDpC30qG3Vg84404NHJ4UtZAwsExahPr0JhALWjnqQC/D9uyT7bxaHbfL2XvEye8IEpBN4SeuwrRMEfriI9M2QkyXLld+TVInEshHsxQdY6FlaiwSqWSAhShLlHMZYFBDTjHGlsJmHHVHOVy15ChdgH3N5SV9EQllPoyAc+QOINBtW9lfrXsn5EGwrqTKeYDNBbOewjUKk/ilvNyCNe4Mvfd7dFfW8MQUF/SYh6BPeuaxtbXZfdBqKVVgXCZh432G3TSYI9iWPjdro/mqWUS6tfBRSblCi6nKZ5/FDtDYcC5rwY3dpXpHCN5gowTZceZ5WdO+IiwIMN+92o6AI2qvF+mcL9eEDzIHUSYfYhIC54bJPasa2hYFrYTbp2cI2iNujkp6/NrqpH6yh35vLfjbX1CP0wXrkB5DPWAkSWGjpgESY67KHgBspUiMQfnFcn6DSfCxvUzNt7oFXInZ5XBO8khK8SM1at930ebrSf3E2WvQZdqAvTR4md2qx/3eL9es4G502+cWw3Sc=",
h: 430,
title: "我的图库",
w: 360
//data: "data:image/svg+xml;base64,PHN2ZyB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWw6c3BhY2U9InByZXNlcnZlIiB2aWV3Qm94PSIwIDAgMjU2IDI1NiIgeT0iMHB4IiB4PSIwcHgiIHZlcnNpb249IjEuMSI+JiN4YTsJPG1ldGFkYXRhPiYjeGE7CQlTdmcgVmVjdG9yIEljb25zIDogaHR0cDovL3d3dy5vbmxpbmV3ZWJmb250cy5jb20vaWNvbiYjeGE7CTwvbWV0YWRhdGE+JiN4YTsJPGc+JiN4YTsJCTxnPiYjeGE7CQkJPHBhdGggZD0iTTIxNS4zLDEwMS41bDEzLjksMjQuMWwtOTcuNSw1LjNsMjIuNSwzOWw0My41LDQuN2w4LDEzLjhsLTU3LjUsMjIuM0wxMDYuMiwyNDZsLTguMS0xNGwxNy45LTQwLjRsLTIyLTM4LjFsLTUzLjMsODEuN2wtMTMuOS0yNC4xbDM3LjgtMTA4LjVsLTM0LTU4LjhjLTYuMy0xMS0zLTI0LjgsNy41LTMwLjljMTAuNS02LDI0LjItMiwzMC41LDguOWwzMy42LDU4LjFMMjE1LjMsMTAxLjV6IE0yMTMuOCwxMTcuM2wtNC40LTcuNmwtMTEzLTIxLjZMNjAuOCwyNi4zYy0zLjgtNi42LTExLjktOS4xLTE4LTUuNnMtOCwxMS44LTQuMiwxOC40bDM2LjEsNjIuNEwzNi44LDIxMC4xbDQuNCw3LjZsNTMuMy04MS43bDMxLjgsNTUuMWwtMTcuOSw0MC40bDAuMywwLjVsMzQuNS0yOWwxLjMtMC42bDQ3LjktMTguNmwtMC40LTAuNmwtNDMuNS00LjdsLTMyLjMtNTUuOUwyMTMuOCwxMTcuM3oiIGZpbGw9IiMwMDAwMDAiLz4mI3hhOwkJPC9nPiYjeGE7CTwvZz4mI3hhOzwvc3ZnPg==",
data: svgImage,
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 xml = that.createLibraryDataFromImages(images_);
// var file = new LocalLibrary(that, xml, '图库');
// that.libraryLoaded(file, images_, null, false);
var file = new LocalLibrary(that, xml, '图库');
that.libraryLoaded(file, images_, null, false);
// const standardGraph = JSON.parse(localStorage.getItem('standardGraph'));
......@@ -188,30 +195,30 @@ const leftCustomGraph = function(that) {//左侧自定义图形
const joinGraph_ = JSON.parse(localStorage.getItem('joinGraph'));
const joinGraph = joinGraph_.graph;
if(joinGraph_.state == 1) {
joinGraph.pop();
joinGraph.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);
// joinGraph.pop();
// joinGraph.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);
}else {
// var file = new LocalLibrary(that, xml, libraryName);
// that.libraryLoaded(file, images, null, false);
// }else {
}
}
})
// }
// }
// })
}else {
// joinGraph.forEach(item => {
// item.subList.forEach(item2 => {
......
......@@ -497,7 +497,11 @@ export function archiAssetShowTree(params) {
}
// 总体架构资产智能搜索,左侧树
export function archiIntelligenceSearchTree(params) {
return post('/network/archi-asset-view/assetTree', params);
return post('/network/archi-asset-view/assetTreeView', params);
}
// 总体架构资产智能搜索,架构版本
export function archiIntelligenceSearchVersionList(params) {
return post('/network/archi-asset-view/assetV', params);
}
// 系统信息管理,表格
export function querysystemInfoManageTable(params) {
......

5.38 KB | W: | H:

691 Bytes | W: | H:

src/assets/meta-model-list/default_img.png
src/assets/meta-model-list/default_img.png
src/assets/meta-model-list/default_img.png
src/assets/meta-model-list/default_img.png
  • 2-up
  • Swipe
  • Onion skin
......@@ -29,11 +29,71 @@
<div class="menu_container">
<el-popover
placement="bottom"
width="440"
width="420"
class="menu_item"
style="margin-right: 80px;cursor: pointer;position: relative;"
v-model="visible1"
trigger="hover">
<div slot="reference">
<img class="menu_icon" src="@/assets/main/4icon_default.png" alt="" />
<img class="menu_icon_active" src="@/assets/main/4icon_press.png" alt="" />
<span class="menu_title">架构全景大屏及智能驾驶舱</span>
<p class="under_line"></p>
</div>
<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 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>
</div>
</div>
</div>
</el-popover>
<el-popover
placement="bottom"
width="440"
class="menu_item"
style="margin-right: 80px;cursor: pointer;position: relative;"
v-model="visible2"
trigger="hover">
<div slot="reference">
<img class="menu_icon" src="@/assets/main/1icon_default.png" alt="" />
<img class="menu_icon_active" src="@/assets/main/1icon_press.png" alt="" />
<span class="menu_title">总体架构资产设计与维护</span>
<p class="under_line"></p>
</div>
<div class="menu_1_container">
<div class="menu_1_item">
<div class="menu_1_item_title">
......@@ -67,13 +127,13 @@
<img src="@/assets/main/2img.png" alt="">
<span style="margin-left: 5px;">总体架构资产维护</span>
</div>
<div class="menu_1_item_subtitle" @click="jumpPage('总体架构资产设计与维护', '总体架构资产维护', '架构视图管理')">
<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" @click="jumpPage('总体架构资产设计与维护', '总体架构资产维护', '总体架构资产管理')">
<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" @click="jumpPage('总体架构资产设计与维护', '总体架构资产维护', '企业中台服务清单')">
<img src="@/assets/main/3img.png" alt="">
......@@ -97,21 +157,21 @@
</div>
</div>
</div>
<div slot="reference">
<img class="menu_icon" src="@/assets/main/1icon_default.png" alt="" />
<img class="menu_icon_active" src="@/assets/main/1icon_press.png" alt="" />
<span class="menu_title">总体架构资产设计与维护</span>
<p class="under_line"></p>
</div>
</el-popover>
<el-popover
placement="bottom"
width="1100"
class="menu_item"
v-model="visible2"
v-model="visible3"
style="margin-right: 80px;cursor: pointer;position: relative;"
trigger="hover">
<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>
<div class="menu_1_container">
<div class="menu_1_item">
<div class="menu_1_item_title">
......@@ -240,75 +300,53 @@
</div>
</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"
width="220"
class="menu_item"
style="margin-right: 80px;cursor: pointer;position: relative;"
v-model="visible3"
v-model="visible4"
trigger="hover">
<div slot="reference">
<img class="menu_icon" src="@/assets/main/4icon_default.png" alt="" />
<img class="menu_icon_active" src="@/assets/main/4icon_press.png" alt="" />
<span class="menu_title">架构资产服务与辅助分析</span>
<p class="under_line"></p>
</div>
<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>
<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>
</div>
<div slot="reference">
<img class="menu_icon" src="@/assets/main/4icon_default.png" alt="" />
<img class="menu_icon_active" src="@/assets/main/4icon_press.png" alt="" />
<span class="menu_title">架构全景大屏及智能驾驶舱</span>
<p class="under_line"></p>
</div>
</el-popover>
<el-popover
placement="bottom"
width="700"
v-model="visible4"
v-model="visible5"
class="menu_item"
style="cursor: pointer;position: relative;"
trigger="hover">
<div slot="reference">
<img class="menu_icon" src="@/assets/main/5icon_default.png" alt="" />
<img class="menu_icon_active" src="@/assets/main/5icon_press.png" alt="" />
<span class="menu_title">架构知识库</span>
<p class="under_line"></p>
</div>
<div class="menu_1_container">
<div class="menu_1_item">
<div class="menu_1_item_title">
......@@ -374,14 +412,6 @@
</div>
</div>
</div>
<div slot="reference">
<img class="menu_icon" src="@/assets/main/5icon_default.png" alt="" />
<img class="menu_icon_active" src="@/assets/main/5icon_press.png" alt="" />
<span class="menu_title">架构知识库</span>
<p class="under_line"></p>
</div>
</el-popover>
</div>
<el-breadcrumb separator="/">
......@@ -412,6 +442,7 @@
visible2: false,
visible3: false,
visible4: false,
visible5: false,
breadcrumb1: '总体架构资产设计与维护',
breadcrumb2: '架构元模型管理',
breadcrumb3: '架构元素管理',
......@@ -444,123 +475,125 @@
switch(breadcrumb3_){
case '架构元素管理':
this.$router.push( '/main/archiEleList', () => {}, () => {} );
this.visible1 = false;
this.visible2 = false;
break;
case '架构元素关系管理':
this.$router.push( '/main/archi-ele-rela', () => {}, () => {} );
this.visible1 = false;
this.visible2 = false;
break;
case '架构视图配置':
this.$router.push( '/main/archi-view-config', () => {}, () => {} );
this.visible1 = false;
this.visible2 = false;
break;
case '元模型字典管理':
this.$router.push( '/main/meta-model-dic', () => {}, () => {} );
this.visible1 = false;
this.visible2 = false;
break;
case '元模型管理':
this.$router.push( '/main/metaModelList', () => {}, () => {} );
this.visible1 = false;
this.visible2 = false;
break;
case '总体架构资产管理':
case '架构资产管理':
this.$router.push( '/main/busiAssetslist', () => {}, () => {} );
this.visible1 = false;
this.visible2 = false;
break;
case '架构视图管理':
this.$router.push( '/main/archiViewManage', () => {}, () => {} );
this.visible2 = false;
break;
case '企业中台服务清单':
this.$router.push( '/main/comCenterServeList', () => {}, () => {} );
this.visible2 = false;
break;
case '现状架构资产管理':
this.$router.push( '/main/currentAssetsList', () => {}, () => {} );
this.visible1 = false;
this.visible2 = false;
break;
case '架构演进路线资产管理':
this.$router.push( '/main/archiEvoluteLine', () => {}, () => {} );
this.visible1 = false;
this.visible2 = false;
break;
case '总体架构资产可视化展示':
this.$router.push( '/main/archiAssetVisualShow', () => {}, () => {} );
this.visible1 = false;
this.visible2 = false;
break;
case '总体架构资产智能搜索':
this.$router.push( '/main/archiIntelligenceSearch', () => {}, () => {} );
this.visible1 = false;
this.visible2 = false;
break;
case '在线文档编制':
this.$router.push( '/main/doc-demo', () => {}, () => {} );
break;
case '技术政策结构化':
this.$router.push( '/main/techPoliticsFabric', () => {}, () => {} );
this.visible4 = false;
break;
case '技术政策库关联使用':
this.$router.push( '/main/techPoliticsRelativeUse', () => {}, () => {} );
this.visible4 = false;
break;
case '报告模板结构化':
this.$router.push( '/main/reportTemplateFabric', () => {}, () => {} );
this.visible4 = false;
break;
case '典型案例库管理':
this.$router.push( '/main/typicalExampleManage', () => {}, () => {} );
this.visible4 = false;
break;
case '典型案例库关联使用':
this.$router.push( '/main/typicalExampleRelativeUse', () => {}, () => {} );
this.visible4 = false;
break;
case '总体架构资产文档库':
this.$router.push( '/main/totalArchiPropertyDocument', () => {}, () => {} );
this.visible4 = false;
break;
case '专家人才库管理':
this.$router.push( '/main/etp-Manage', () => {}, () => {} );
this.visible4 = false;
break;
case '报告模板关联使用':
this.$router.push( '/main/reportTemplateRelativeUse', () => {}, () => {} );
this.visible4 = false;
break;
case '架构视图管理':
this.$router.push( '/main/archiViewManage', () => {}, () => {} );
this.visible1 = false;
break;
case '系统架构资产维护':
this.$router.push( '/main/archiAssetManage', () => {}, () => {} );
this.visible2 = false;
break;
case '系统信息管理':
this.$router.push( '/main/systemInfoManage', () => {}, () => {} );
this.visible2 = false;
this.visible3 = false;
break;
case '项目信息管理':
this.$router.push( '/main/projectInfoManage', () => {}, () => {} );
this.visible2 = false;
this.visible3 = false;
break;
case '系统架构资产维护':
this.$router.push( '/main/archiAssetManage', () => {}, () => {} );
this.visible3 = false;
break;
case '系统架构视图设计':
this.$router.push( '/main/systemArchiViewDesign', () => {}, () => {} );
this.visible2 = false;
break;
case '企业中台服务清单':
this.$router.push( '/main/comCenterServeList', () => {}, () => {} );
this.visible1 = false;
this.visible3 = false;
break;
case '概设阶段架构设计':
this.$router.push( '/main/summaryArchiDesign', () => {}, () => {} );
this.visible2 = false;
this.visible3 = false;
break;
case '其他视图设计':
this.$router.push( '/main/otherArchiDesign', () => {}, () => {} );
this.visible2 = false;
this.visible3 = false;
break;
case '评审情况(概要设计)':
this.$router.push( '/main/reviewSituation', () => {}, () => {} );
this.visible2 = false;
this.visible3 = false;
break;
case '概设架构遵从检查':
this.$router.push( '/main/reviewArchiFollowCheck', () => {}, () => {} );
this.visible2 = false;
this.visible3 = false;
break;
case '概设架构政策审查':
this.$router.push( '/main/reviewArchiPoliticeCheck', () => {}, () => {} );
this.visible2 = false;
this.visible3 = false;
break;
case '技术政策结构化':
this.$router.push( '/main/techPoliticsFabric', () => {}, () => {} );
this.visible5 = false;
break;
case '技术政策库关联使用':
this.$router.push( '/main/techPoliticsRelativeUse', () => {}, () => {} );
this.visible5 = false;
break;
case '报告模板结构化':
this.$router.push( '/main/reportTemplateFabric', () => {}, () => {} );
this.visible5 = false;
break;
case '典型案例库管理':
this.$router.push( '/main/typicalExampleManage', () => {}, () => {} );
this.visible5 = false;
break;
case '典型案例库关联使用':
this.$router.push( '/main/typicalExampleRelativeUse', () => {}, () => {} );
this.visible5 = false;
break;
case '总体架构资产文档库':
this.$router.push( '/main/totalArchiPropertyDocument', () => {}, () => {} );
this.visible5 = false;
break;
case '专家人才库管理':
this.$router.push( '/main/etp-Manage', () => {}, () => {} );
this.visible5 = false;
break;
case '报告模板关联使用':
this.$router.push( '/main/reportTemplateRelativeUse', () => {}, () => {} );
this.visible5 = false;
break;
}
}
}
......
......@@ -63,19 +63,20 @@
<el-table-column type="index" label="序号" width="80" align="center"></el-table-column>
<el-table-column prop="assetName" label="资产名称" width="300" :show-overflow-tooltip="true" align="center"></el-table-column>
<el-table-column prop="eleName" label="资产类型(所属元素)" align="center"></el-table-column>
<el-table-column label="是否继承" align="center">
<el-table-column label="来源" align="center">
<template slot-scope="scope">
<span v-if="scope.row.isExtend == 1"></span>
<span v-if="scope.row.isExtend == 0"></span>
<span v-if="scope.row.isExtend == 1">总体资产</span>
<span v-if="scope.row.isExtend == 0">系统资产</span>
</template>
</el-table-column>
<el-table-column prop="createMan" label="创建人" align="center"></el-table-column>
<el-table-column prop="createTime" label="创建时间" align="center"></el-table-column>
<el-table-column label="操作" width="300" align="center">
<el-table-column label="操作" width="360" 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="editItem(scope.row)" :disabled="scope.row.state == 1">编辑</el-button>
<el-button icon="el-icon-upload2" type="primary" size="mini" @click="releaseItem(scope.row)" :disabled="scope.row.state == 1 ">发布</el-button>
<el-button class="tingYong_btn" icon="el-icon-remove-outline" size="mini" @click="stopItem(scope.row)" :disabled="scope.row.state != 1">停用</el-button>
<el-button class="shanChu_btn" icon="el-icon-delete" size="mini" @click="deleteItem(scope.row)" :disabled="scope.row.state == 1">删除</el-button>
</div>
</template>
......@@ -244,7 +245,7 @@
</el-dialog>
<el-dialog
title='新建架构'
:title="is_add_edit == 'add' ? '新建架构' : '编辑架构'"
:visible.sync="add_dialog3"
:center="false"
:close-on-click-modal="false"
......@@ -901,6 +902,40 @@
}
});
},
stopItem(row) {//停用
MessageBox.confirm('确定发布?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
customClass: 'messageClass',
confirmButtonClass: 'confirmClass',
type: 'warning'
}).then(() => {
const params = {
assetId: row.assetId,
state: 0,
assetConstant: this.assetConstant,
}
editSystemTable(params).then(res => {
if(res.code == 200) {
this.get_table();
Message({
type: 'success',
message: '发布成功!'
});
}else {
Message({
type: 'error',
message: res.msg
});
}
});
}).catch(() => {
Message({
type: 'info',
message: '已取消'
});
});
},
releaseItem(row) {//发布
MessageBox.confirm('确定发布?', '提示', {
confirmButtonText: '确定',
......@@ -1199,6 +1234,10 @@
/deep/ .el-pagination.is-background .el-pager li:not(.disabled).active{
background-color: #0D867F;
}
.tingYong_btn{
color: #DEA82A;
background-color: #FDF6E6;
}
.shanChu_btn{
color: #DD6A15;
background-color: #F8EBE2;
......
<template>
<div class="archiIntelligenceSearch">
<div class="left_container">
<div class="search_menu_item" style="margin-top: 15px;">
<span class="search_title">架构内容:</span>
<!-- <el-input v-no-backslash v-model="query_item1" placeholder="请输入" style="width: 300px;" maxlength="100"></el-input> -->
<el-input placeholder="请输入内容" v-model="query_item1" style="width: 300px;">
<template slot="append">
<div style="cursor: pointer;width: 50px;height: 35px;display: flex;justify-content: center;align-items: center;" @click="select1">
<i class="el-icon-search"></i>
</div>
</template>
</el-input>
</div>
<div class="search_menu_item">
<span class="search_title">架构版本:</span>
<el-select v-model="query_item2" clearable placeholder="请选择" style="width: 300px;" @change="select2">
<el-option v-for="item in archiList" :key="item.versionId" :label="item.versionName" :value="item.versionId"></el-option>
</el-select>
</div>
<el-tree
class="filter-tree"
:data="treeData"
:highlight-current="true"
:props="{ children: 'subList', label: 'assetName', id: 'assetId' }"
:props="{ children: 'children', label: 'name', id: 'id' }"
default-expand-all
show-checkbox
node-key="assetId"
node-key="id"
:check-strictly="true"
@check="treeCheckChange"
ref="tree">
</el-tree>
......@@ -22,6 +40,7 @@
<script>
import {
archiIntelligenceSearchTree,
archiIntelligenceSearchVersionList
} from '@/api/index.js';
import { MessageBox, Message } from 'element-ui';
import $ from 'jquery';
......@@ -32,12 +51,23 @@ export default {
return {
treeData: [],
myChart: null,
query_item1: null,
query_item2: null,
archiList: []
};
},
mounted(){
this.getTreeData();
this.getVisionList();
},
methods: {
select1() {
this.getTreeData();
},
select2(data) {
this.getTreeData();
},
echarts1(seriesData, linkData) {
this.myChart = echarts.init(document.getElementById('echartsContainer'));
......@@ -51,6 +81,7 @@ export default {
{
type: 'graph',
layout: 'force',
roam: true,
symbolSize: [ 120, 60 ],
label: {
normal: {
......@@ -70,7 +101,9 @@ export default {
}
},
force: {
repulsion: 3000
// repulsion: 500,
repulsion: 1000, //节点之间的斥力因子。
edgeLength: 100 //边的两个节点之间的距离,这个距离也会受 repulsion。
},
// edgeSymbol: ['circle', 'arrow'],
data: seriesData,
......@@ -81,8 +114,19 @@ export default {
this.myChart.setOption(option);
},
getTreeData(type) {//查询左侧树
archiIntelligenceSearchTree({}).then(res => {
getVisionList() {//查询架构版本
archiIntelligenceSearchVersionList({}).then(res => {
if(res.code == 200) {
this.archiList = res.data;
}
});
},
getTreeData() {//查询左侧树
const params = {
"assetName": this.query_item1,
"versionId": this.query_item2,
}
archiIntelligenceSearchTree(params).then(res => {
if(res.code == 200) {
this.treeData = res.data;
}
......@@ -90,7 +134,11 @@ export default {
},
treeCheckChange(data, tree) {//左侧树勾选
let seriesData = [], linkData = [];
if(tree.checkedNodes.length > 0) {
console.log(tree.checkedNodes)
tree.checkedNodes.forEach(item => {
if(!item.targetList){
return;
......@@ -127,22 +175,24 @@ export default {
}
})
var new_arr2 = []
for (var i = 0; i < seriesData.length; i++) {
var flag = true
for (var j = 0; j < new_arr2.length; j++) {
if (new_arr2[j].id == seriesData[i].id) {
flag = false
}
}
if (flag) {
new_arr2.push(seriesData[i])
}
}
seriesData = new_arr2;
this.echarts1(seriesData, linkData);
// var new_arr2 = []
// for (var i = 0; i < seriesData.length; i++) {
// var flag = true
// for (var j = 0; j < new_arr2.length; j++) {
// if (new_arr2[j].id == seriesData[i].id) {
// flag = false
// }
// }
// if (flag) {
// new_arr2.push(seriesData[i])
// }
// }
// seriesData = new_arr2;
// this.echarts1(seriesData, linkData);
}else {
this.myChart.dispose();
// this.myChart.dispose();
}
},
}
......@@ -154,24 +204,43 @@ export default {
<style scoped>
.filter-tree{
width: 300px;
height: 100%;
height: calc(100% - 120px);
overflow-y: auto;
display: inline-block;
}
/deep/ .is-leaf {
background-color: #fff !important;
}
.search_menu_item{
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 10px;
}
.search_title{
font-size: 14px;
color: #606291;
flex-shrink: 0;
margin-right: 10px;
}
.archiIntelligenceSearch{
width: 100%;
height: 100%;
display: flex;
}
.left_container{
width: 20%;
width: 25%;
margin-right: 20px;
height: 100%;
border: 1px solid #ccc;
text-align: center;
}
.right_container{
width: 80%;
width: 75%;
height: 100%;
pornhub: hidden;
}
/deep/ .el-input-group__append{
padding: 0;
}
</style>
\ No newline at end of file
......@@ -44,41 +44,38 @@
<el-table :height="tableHeight" @selection-change="handleSelectionChange" v-loading="loading" :data="tableData" stripe border>
<el-table-column type="selection" width="55"></el-table-column>
<el-table-column type="index" label="序号" width="80" align="center"></el-table-column>
<el-table-column prop="inventoryName" label="服务名称" align="center"></el-table-column>
<el-table-column prop="tcType" label="服务来源" align="center"></el-table-column>
<el-table-column prop="platformSource" label="平台来源" align="center"></el-table-column>
<el-table-column label="服务类型" align="center">
<el-table-column label="企业中台" align="center">
<template slot-scope="scope">
<span v-if="scope.row.serveType == 1">聚合服务</span>
<span v-if="scope.row.serveType == 2">规则服务</span>
<span v-if="scope.row.serveType == 3">数据服务</span>
<span v-else>原子服务</span>
<span v-if="scope.row.abilityType == 1">业务中台服务能力</span>
<span v-else-if="scope.row.abilityType == 2">数据中台资源目录</span>
<span v-else-if="scope.row.abilityType == 3">数据中台资源服务</span>
<span v-else-if="scope.row.abilityType == 4">技术中台公共技术能力</span>
</template>
</el-table-column>
<el-table-column prop="departName" label="中心名称" align="center"></el-table-column>
<el-table-column prop="module" label="模块" align="center"></el-table-column>
<el-table-column prop="inventoryName" label="服务名称" align="center"></el-table-column>
<el-table-column prop="serveRemark" label="服务描述" align="center"></el-table-column>
<el-table-column label="服务状态" align="center">
<template slot-scope="scope">
<span v-if="scope.row.serveState == 1">在建</span>
<span v-else>在运</span>
<span v-if="scope.row.serveType == 1">聚合服务</span>
<span v-else-if="scope.row.serveType == 2">规则服务</span>
<span v-else-if="scope.row.serveType == 3">数据服务</span>
<span v-else-if="scope.row.serveType == 4">原子服务</span>
</template>
</el-table-column>
<el-table-column prop="serveRemark" label="服务描述" align="center"></el-table-column>
<el-table-column prop="module" label="模块" align="center"></el-table-column>
<el-table-column label="状态" align="center">
<el-table-column prop="serveState" label="服务类型" align="center">
<template slot-scope="scope">
<span v-if="scope.row.state == 0">已停用</span>
<span v-if="scope.row.state == 1">已发布</span>
<span v-if="scope.row.state == 2">暂存</span>
<span v-if="scope.row.serveState == 1">在建</span>
<span v-else-if="scope.row.serveState == 2">在运</span>
</template>
</el-table-column>
<el-table-column prop="departName" label="归属部门" align="center"></el-table-column>
<el-table-column prop="compName" label="建设单位" align="center"></el-table-column>
<el-table-column prop="publishTime" label="发布时间" align="center" :show-overflow-tooltip="true"></el-table-column>
<el-table-column prop="description" label="简介" align="center"></el-table-column>
<el-table-column prop="inventoryVersion" label="版本" align="center"></el-table-column>
<el-table-column label="操作" width="150" align="center">
<el-table-column label="操作" width="250" align="center">
<template slot-scope="scope">
<div style="display: flex;align-items: center;justify-content: center;">
<el-button icon="el-icon-view" type="primary" size="mini" @click="operate('view',scope.row)">查看</el-button>
<el-button icon="el-icon-upload2" type="primary" size="mini" @click="cancelReleaseItem(scope.row)" v-if="scope.row.state == 1">取消发布</el-button>
<el-button icon="el-icon-upload2" type="primary" size="mini" @click="releaseItem(scope.row)" v-if="scope.row.state != 1">发布</el-button>
</div>
</template>
</el-table-column>
......@@ -104,46 +101,36 @@
<div class="add_dialog_content">
<el-form :model="formData" ref="form">
<div class="form_item_container">
<el-form-item label="案例名称:" prop="tcName">
<el-input v-model="formData.tcName"></el-input>
</el-form-item>
<el-form-item label="案例类型:" prop="tcType">
<el-select v-model="formData.tcType" placeholder="请选择">
<el-option v-for="item in selectData1" :key="item.label" :label="item.label" :value="item.value"></el-option>
</el-select>
<el-form-item label="企业中台:" prop="abilityType">
<el-input v-model="formData.abilityType" readonly></el-input>
</el-form-item>
<el-form-item label="项目类型:" prop="prjType">
<el-select v-model="formData.prjType" placeholder="请选择">
<el-option v-for="item in selectData3" :key="item.label" :label="item.label" :value="item.value"></el-option>
</el-select>
<el-form-item label="中心名称:" prop="departName">
<el-input v-model="formData.departName" readonly></el-input>
</el-form-item>
<el-form-item label="建设内容:" prop="buildContent">
<el-input v-model="formData.buildContent"></el-input>
<el-form-item label="模块:" prop="module">
<el-input v-model="formData.module" readonly></el-input>
</el-form-item>
<el-form-item label="问题类型:" prop="problemType">
<el-select v-model="formData.problemType" placeholder="请选择">
<el-option v-for="item in selectData2" :key="item.label" :label="item.label" :value="item.value"></el-option>
</el-select>
<el-form-item label="服务名称:" prop="inventoryName">
<el-input v-model="formData.inventoryName" readonly></el-input>
</el-form-item>
<el-form-item label="问题等级:" prop="problemLevel">
<el-select v-model="formData.problemLevel" placeholder="请选择">
<el-option v-for="item in selectData4" :key="item.label" :label="item.label" :value="item.value"></el-option>
</el-select>
<el-form-item class="cross1" label="服务描述:" prop="serveRemark">
<el-input type="textarea" readonly v-model="formData.serveRemark" maxlength="200" show-word-limit></el-input>
</el-form-item>
<el-form-item class="cross1" label="架构详情:" prop="archiDetail">
<el-input type="textarea" v-model="formData.archiDetail" maxlength="200" show-word-limit></el-input>
<el-form-item label="服务状态:" prop="serveType">
<el-input v-model="formData.serveType" readonly></el-input>
</el-form-item>
<el-form-item class="cross1" label="问题描述:" prop="problemContent">
<el-input type="textarea" v-model="formData.problemContent" maxlength="200" show-word-limit></el-input>
<el-form-item label="服务类型:" prop="serveState">
<el-input v-model="formData.serveState" readonly></el-input>
</el-form-item>
</div>
</el-form>
</div>
</div>
<span slot="footer" class="dialog-footer">
<!-- <span slot="footer" class="dialog-footer">
<el-button class="greenButton" @click="operate('create')">确定</el-button>
<el-button @click="add_dialog = false">取消</el-button>
</span>
</span> -->
</el-dialog>
</div>
</template>
......@@ -199,14 +186,13 @@ export default {
total: 0, //总条数
},
formData: {
tcName: '',
tcType: '',
prjType: '',
buildContent: '',
problemType: '',
problemLevel: '',
problemContent: '',
archiDetail: "",
abilityType: '',
departName: '',
module: '',
inventoryName: '',
serveRemark: '',
serveType: '',
serveState: '',
},
tableHeight: null,
dicObj: {
......@@ -264,14 +250,49 @@ export default {
this.add_dialog = true;
this.title = "新建案例";
this.resetForm();
}else if (type == "edit") {
}else if(type == 'view') {
this.add_dialog = true;
this.title = "编辑案例";
this.title = "查看案例";
this.formData = item;
this.formData.tcType = String(this.formData.tcType);
this.formData.problemType = String(this.formData.problemType);
this.formData.prjType = String(this.formData.prjType);
this.formData.problemLevel = String(this.formData.problemLevel);
switch(item.abilityType){
case '1':
this.formData.abilityType = '业务中台服务能力';
break;
case '2':
this.formData.abilityType = '数据中台资源目录';
break;
case '3':
this.formData.abilityType = '数据中台资源服务';
break;
case '4':
this.formData.abilityType = '技术中台公共技术能力';
break;
}
switch(item.serveType){
case 1:
this.formData.serveType = '聚合服务';
break;
case 2:
this.formData.serveType = '规则服务';
break;
case 3:
this.formData.serveType = '数据服务';
break;
case 4:
this.formData.serveType = '原子服务';
break;
}
if(item.serveState == 1) {
this.formData.serveState = '在建';
}else {
this.formData.serveState = '在运';
}
}else if (type == "create") {
if (this.formData.ktcId) {
// 编辑保存
......
......@@ -44,41 +44,38 @@
<el-table :height="tableHeight" @selection-change="handleSelectionChange" v-loading="loading" :data="tableData" stripe border>
<el-table-column type="selection" width="55"></el-table-column>
<el-table-column type="index" label="序号" width="80" align="center"></el-table-column>
<el-table-column prop="inventoryName" label="服务名称" align="center"></el-table-column>
<el-table-column prop="tcType" label="服务来源" align="center"></el-table-column>
<el-table-column prop="platformSource" label="平台来源" align="center"></el-table-column>
<el-table-column label="服务类型" align="center">
<el-table-column label="企业中台" align="center">
<template slot-scope="scope">
<span v-if="scope.row.serveType == 1">聚合服务</span>
<span v-if="scope.row.serveType == 2">规则服务</span>
<span v-if="scope.row.serveType == 3">数据服务</span>
<span v-else>原子服务</span>
<span v-if="scope.row.abilityType == 1">业务中台服务能力</span>
<span v-else-if="scope.row.abilityType == 2">数据中台资源目录</span>
<span v-else-if="scope.row.abilityType == 3">数据中台资源服务</span>
<span v-else-if="scope.row.abilityType == 4">技术中台公共技术能力</span>
</template>
</el-table-column>
<el-table-column prop="departName" label="中心名称" align="center"></el-table-column>
<el-table-column prop="module" label="模块" align="center"></el-table-column>
<el-table-column prop="inventoryName" label="服务名称" align="center"></el-table-column>
<el-table-column prop="serveRemark" label="服务描述" align="center"></el-table-column>
<el-table-column label="服务状态" align="center">
<template slot-scope="scope">
<span v-if="scope.row.serveState == 1">在建</span>
<span v-else>在运</span>
<span v-if="scope.row.serveType == 1">聚合服务</span>
<span v-else-if="scope.row.serveType == 2">规则服务</span>
<span v-else-if="scope.row.serveType == 3">数据服务</span>
<span v-else-if="scope.row.serveType == 4">原子服务</span>
</template>
</el-table-column>
<el-table-column prop="serveRemark" label="服务描述" align="center"></el-table-column>
<el-table-column prop="module" label="模块" align="center"></el-table-column>
<el-table-column label="状态" align="center">
<el-table-column prop="serveState" label="服务类型" align="center">
<template slot-scope="scope">
<span v-if="scope.row.state == 0">已停用</span>
<span v-if="scope.row.state == 1">已发布</span>
<span v-if="scope.row.state == 2">暂存</span>
<span v-if="scope.row.serveState == 1">在建</span>
<span v-else-if="scope.row.serveState == 2">在运</span>
</template>
</el-table-column>
<el-table-column prop="departName" label="归属部门" align="center"></el-table-column>
<el-table-column prop="compName" label="建设单位" align="center"></el-table-column>
<el-table-column prop="publishTime" label="发布时间" align="center" :show-overflow-tooltip="true"></el-table-column>
<el-table-column prop="description" label="简介" align="center"></el-table-column>
<el-table-column prop="inventoryVersion" label="版本" align="center"></el-table-column>
<el-table-column label="操作" width="150" align="center">
<el-table-column label="操作" width="250" align="center">
<template slot-scope="scope">
<div style="display: flex;align-items: center;justify-content: center;">
<el-button icon="el-icon-view" type="primary" size="mini" @click="operate('view',scope.row)">查看</el-button>
<el-button icon="el-icon-upload2" type="primary" size="mini" @click="cancelReleaseItem(scope.row)" v-if="scope.row.state == 1">取消发布</el-button>
<el-button icon="el-icon-upload2" type="primary" size="mini" @click="releaseItem(scope.row)" v-if="scope.row.state != 1">发布</el-button>
</div>
</template>
</el-table-column>
......@@ -104,46 +101,32 @@
<div class="add_dialog_content">
<el-form :model="formData" ref="form">
<div class="form_item_container">
<el-form-item label="案例名称:" prop="tcName">
<el-input v-model="formData.tcName"></el-input>
</el-form-item>
<el-form-item label="案例类型:" prop="tcType">
<el-select v-model="formData.tcType" placeholder="请选择">
<el-option v-for="item in selectData1" :key="item.label" :label="item.label" :value="item.value"></el-option>
</el-select>
<el-form-item label="企业中台:" prop="abilityType">
<el-input v-model="formData.abilityType" readonly></el-input>
</el-form-item>
<el-form-item label="项目类型:" prop="prjType">
<el-select v-model="formData.prjType" placeholder="请选择">
<el-option v-for="item in selectData3" :key="item.label" :label="item.label" :value="item.value"></el-option>
</el-select>
<el-form-item label="中心名称:" prop="departName">
<el-input v-model="formData.departName" readonly></el-input>
</el-form-item>
<el-form-item label="建设内容:" prop="buildContent">
<el-input v-model="formData.buildContent"></el-input>
<el-form-item label="模块:" prop="module">
<el-input v-model="formData.module" readonly></el-input>
</el-form-item>
<el-form-item label="问题类型:" prop="problemType">
<el-select v-model="formData.problemType" placeholder="请选择">
<el-option v-for="item in selectData2" :key="item.label" :label="item.label" :value="item.value"></el-option>
</el-select>
<el-form-item label="服务名称:" prop="inventoryName">
<el-input v-model="formData.inventoryName" readonly></el-input>
</el-form-item>
<el-form-item label="问题等级:" prop="problemLevel">
<el-select v-model="formData.problemLevel" placeholder="请选择">
<el-option v-for="item in selectData4" :key="item.label" :label="item.label" :value="item.value"></el-option>
</el-select>
<el-form-item class="cross1" label="服务描述:" prop="serveRemark">
<el-input type="textarea" readonly v-model="formData.serveRemark" maxlength="200" show-word-limit></el-input>
</el-form-item>
<el-form-item class="cross1" label="架构详情:" prop="archiDetail">
<el-input type="textarea" v-model="formData.archiDetail" maxlength="200" show-word-limit></el-input>
<el-form-item label="服务状态:" prop="serveType">
<el-input v-model="formData.serveType" readonly></el-input>
</el-form-item>
<el-form-item class="cross1" label="问题描述:" prop="problemContent">
<el-input type="textarea" v-model="formData.problemContent" maxlength="200" show-word-limit></el-input>
<el-form-item label="服务类型:" prop="serveState">
<el-input v-model="formData.serveState" readonly></el-input>
</el-form-item>
</div>
</el-form>
</div>
</div>
<span slot="footer" class="dialog-footer">
<el-button class="greenButton" @click="operate('create')">确定</el-button>
<el-button @click="add_dialog = false">取消</el-button>
</span>
</el-dialog>
</div>
</template>
......@@ -199,14 +182,13 @@ export default {
total: 0, //总条数
},
formData: {
tcName: '',
tcType: '',
prjType: '',
buildContent: '',
problemType: '',
problemLevel: '',
problemContent: '',
archiDetail: "",
abilityType: '',
departName: '',
module: '',
inventoryName: '',
serveRemark: '',
serveType: '',
serveState: '',
},
tableHeight: null,
dicObj: {
......@@ -264,14 +246,49 @@ export default {
this.add_dialog = true;
this.title = "新建案例";
this.resetForm();
}else if (type == "edit") {
}else if (type == "view") {
this.add_dialog = true;
this.title = "编辑案例";
this.title = "查看案例";
this.formData = item;
this.formData.tcType = String(this.formData.tcType);
this.formData.problemType = String(this.formData.problemType);
this.formData.prjType = String(this.formData.prjType);
this.formData.problemLevel = String(this.formData.problemLevel);
switch(item.abilityType){
case '1':
this.formData.abilityType = '业务中台服务能力';
break;
case '2':
this.formData.abilityType = '数据中台资源目录';
break;
case '3':
this.formData.abilityType = '数据中台资源服务';
break;
case '4':
this.formData.abilityType = '技术中台公共技术能力';
break;
}
switch(item.serveType){
case 1:
this.formData.serveType = '聚合服务';
break;
case 2:
this.formData.serveType = '规则服务';
break;
case 3:
this.formData.serveType = '数据服务';
break;
case 4:
this.formData.serveType = '原子服务';
break;
}
if(item.serveState == 1) {
this.formData.serveState = '在建';
}else {
this.formData.serveState = '在运';
}
}else if (type == "create") {
if (this.formData.ktcId) {
// 编辑保存
......
......@@ -44,41 +44,38 @@
<el-table :height="tableHeight" @selection-change="handleSelectionChange" v-loading="loading" :data="tableData" stripe border>
<el-table-column type="selection" width="55"></el-table-column>
<el-table-column type="index" label="序号" width="80" align="center"></el-table-column>
<el-table-column prop="inventoryName" label="服务名称" align="center"></el-table-column>
<el-table-column prop="tcType" label="服务来源" align="center"></el-table-column>
<el-table-column prop="platformSource" label="平台来源" align="center"></el-table-column>
<el-table-column label="服务类型" align="center">
<el-table-column label="企业中台" align="center">
<template slot-scope="scope">
<span v-if="scope.row.serveType == 1">聚合服务</span>
<span v-if="scope.row.serveType == 2">规则服务</span>
<span v-if="scope.row.serveType == 3">数据服务</span>
<span v-else>原子服务</span>
<span v-if="scope.row.abilityType == 1">业务中台服务能力</span>
<span v-else-if="scope.row.abilityType == 2">数据中台资源目录</span>
<span v-else-if="scope.row.abilityType == 3">数据中台资源服务</span>
<span v-else-if="scope.row.abilityType == 4">技术中台公共技术能力</span>
</template>
</el-table-column>
<el-table-column prop="departName" label="中心名称" align="center"></el-table-column>
<el-table-column prop="module" label="模块" align="center"></el-table-column>
<el-table-column prop="inventoryName" label="服务名称" align="center"></el-table-column>
<el-table-column prop="serveRemark" label="服务描述" align="center"></el-table-column>
<el-table-column label="服务状态" align="center">
<template slot-scope="scope">
<span v-if="scope.row.serveState == 1">在建</span>
<span v-else>在运</span>
<span v-if="scope.row.serveType == 1">聚合服务</span>
<span v-else-if="scope.row.serveType == 2">规则服务</span>
<span v-else-if="scope.row.serveType == 3">数据服务</span>
<span v-else-if="scope.row.serveType == 4">原子服务</span>
</template>
</el-table-column>
<el-table-column prop="serveRemark" label="服务描述" align="center"></el-table-column>
<el-table-column prop="module" label="模块" align="center"></el-table-column>
<el-table-column label="状态" align="center">
<el-table-column prop="serveState" label="服务类型" align="center">
<template slot-scope="scope">
<span v-if="scope.row.state == 0">已停用</span>
<span v-if="scope.row.state == 1">已发布</span>
<span v-if="scope.row.state == 2">暂存</span>
<span v-if="scope.row.serveState == 1">在建</span>
<span v-else-if="scope.row.serveState == 2">在运</span>
</template>
</el-table-column>
<el-table-column prop="departName" label="归属部门" align="center"></el-table-column>
<el-table-column prop="compName" label="建设单位" align="center"></el-table-column>
<el-table-column prop="publishTime" label="发布时间" align="center" :show-overflow-tooltip="true"></el-table-column>
<el-table-column prop="description" label="简介" align="center"></el-table-column>
<el-table-column prop="inventoryVersion" label="版本" align="center"></el-table-column>
<el-table-column label="操作" width="150" align="center">
<el-table-column label="操作" width="250" align="center">
<template slot-scope="scope">
<div style="display: flex;align-items: center;justify-content: center;">
<el-button icon="el-icon-view" type="primary" size="mini" @click="operate('view',scope.row)">查看</el-button>
<el-button icon="el-icon-upload2" type="primary" size="mini" @click="cancelReleaseItem(scope.row)" v-if="scope.row.state == 1">取消发布</el-button>
<el-button icon="el-icon-upload2" type="primary" size="mini" @click="releaseItem(scope.row)" v-if="scope.row.state != 1">发布</el-button>
</div>
</template>
</el-table-column>
......@@ -104,46 +101,33 @@
<div class="add_dialog_content">
<el-form :model="formData" ref="form">
<div class="form_item_container">
<el-form-item label="案例名称:" prop="tcName">
<el-input v-model="formData.tcName"></el-input>
</el-form-item>
<el-form-item label="案例类型:" prop="tcType">
<el-select v-model="formData.tcType" placeholder="请选择">
<el-option v-for="item in selectData1" :key="item.label" :label="item.label" :value="item.value"></el-option>
</el-select>
<el-form-item label="企业中台:" prop="abilityType">
<el-input v-model="formData.abilityType" readonly></el-input>
</el-form-item>
<el-form-item label="项目类型:" prop="prjType">
<el-select v-model="formData.prjType" placeholder="请选择">
<el-option v-for="item in selectData3" :key="item.label" :label="item.label" :value="item.value"></el-option>
</el-select>
<el-form-item label="中心名称:" prop="departName">
<el-input v-model="formData.departName" readonly></el-input>
</el-form-item>
<el-form-item label="建设内容:" prop="buildContent">
<el-input v-model="formData.buildContent"></el-input>
<el-form-item label="模块:" prop="module">
<el-input v-model="formData.module" readonly></el-input>
</el-form-item>
<el-form-item label="问题类型:" prop="problemType">
<el-select v-model="formData.problemType" placeholder="请选择">
<el-option v-for="item in selectData2" :key="item.label" :label="item.label" :value="item.value"></el-option>
</el-select>
<el-form-item label="服务名称:" prop="inventoryName">
<el-input v-model="formData.inventoryName" readonly></el-input>
</el-form-item>
<el-form-item label="问题等级:" prop="problemLevel">
<el-select v-model="formData.problemLevel" placeholder="请选择">
<el-option v-for="item in selectData4" :key="item.label" :label="item.label" :value="item.value"></el-option>
</el-select>
<el-form-item class="cross1" label="服务描述:" prop="serveRemark">
<el-input type="textarea" readonly v-model="formData.serveRemark" maxlength="200" show-word-limit></el-input>
</el-form-item>
<el-form-item class="cross1" label="架构详情:" prop="archiDetail">
<el-input type="textarea" v-model="formData.archiDetail" maxlength="200" show-word-limit></el-input>
<el-form-item label="服务状态:" prop="serveType">
<el-input v-model="formData.serveType" readonly></el-input>
</el-form-item>
<el-form-item class="cross1" label="问题描述:" prop="problemContent">
<el-input type="textarea" v-model="formData.problemContent" maxlength="200" show-word-limit></el-input>
<el-form-item label="服务类型:" prop="serveState">
<el-input v-model="formData.serveState" readonly></el-input>
</el-form-item>
</div>
</el-form>
</div>
</div>
<span slot="footer" class="dialog-footer">
<el-button class="greenButton" @click="operate('create')">确定</el-button>
<el-button @click="add_dialog = false">取消</el-button>
</span>
</el-dialog>
</div>
</template>
......@@ -199,14 +183,13 @@ export default {
total: 0, //总条数
},
formData: {
tcName: '',
tcType: '',
prjType: '',
buildContent: '',
problemType: '',
problemLevel: '',
problemContent: '',
archiDetail: "",
abilityType: '',
departName: '',
module: '',
inventoryName: '',
serveRemark: '',
serveType: '',
serveState: '',
},
tableHeight: null,
dicObj: {
......@@ -264,14 +247,49 @@ export default {
this.add_dialog = true;
this.title = "新建案例";
this.resetForm();
}else if (type == "edit") {
}else if (type == "view") {
this.add_dialog = true;
this.title = "编辑案例";
this.title = "查看案例";
this.formData = item;
this.formData.tcType = String(this.formData.tcType);
this.formData.problemType = String(this.formData.problemType);
this.formData.prjType = String(this.formData.prjType);
this.formData.problemLevel = String(this.formData.problemLevel);
switch(item.abilityType){
case '1':
this.formData.abilityType = '业务中台服务能力';
break;
case '2':
this.formData.abilityType = '数据中台资源目录';
break;
case '3':
this.formData.abilityType = '数据中台资源服务';
break;
case '4':
this.formData.abilityType = '技术中台公共技术能力';
break;
}
switch(item.serveType){
case 1:
this.formData.serveType = '聚合服务';
break;
case 2:
this.formData.serveType = '规则服务';
break;
case 3:
this.formData.serveType = '数据服务';
break;
case 4:
this.formData.serveType = '原子服务';
break;
}
if(item.serveState == 1) {
this.formData.serveState = '在建';
}else {
this.formData.serveState = '在运';
}
}else if (type == "create") {
if (this.formData.ktcId) {
// 编辑保存
......
......@@ -44,41 +44,38 @@
<el-table :height="tableHeight" @selection-change="handleSelectionChange" v-loading="loading" :data="tableData" stripe border>
<el-table-column type="selection" width="55"></el-table-column>
<el-table-column type="index" label="序号" width="80" align="center"></el-table-column>
<el-table-column prop="inventoryName" label="服务名称" align="center"></el-table-column>
<el-table-column prop="tcType" label="服务来源" align="center"></el-table-column>
<el-table-column prop="platformSource" label="平台来源" align="center"></el-table-column>
<el-table-column label="服务类型" align="center">
<el-table-column label="企业中台" align="center">
<template slot-scope="scope">
<span v-if="scope.row.serveType == 1">聚合服务</span>
<span v-if="scope.row.serveType == 2">规则服务</span>
<span v-if="scope.row.serveType == 3">数据服务</span>
<span v-else>原子服务</span>
<span v-if="scope.row.abilityType == 1">业务中台服务能力</span>
<span v-else-if="scope.row.abilityType == 2">数据中台资源目录</span>
<span v-else-if="scope.row.abilityType == 3">数据中台资源服务</span>
<span v-else-if="scope.row.abilityType == 4">技术中台公共技术能力</span>
</template>
</el-table-column>
<el-table-column prop="departName" label="中心名称" align="center"></el-table-column>
<el-table-column prop="module" label="模块" align="center"></el-table-column>
<el-table-column prop="inventoryName" label="服务名称" align="center"></el-table-column>
<el-table-column prop="serveRemark" label="服务描述" align="center"></el-table-column>
<el-table-column label="服务状态" align="center">
<template slot-scope="scope">
<span v-if="scope.row.serveState == 1">在建</span>
<span v-else>在运</span>
<span v-if="scope.row.serveType == 1">聚合服务</span>
<span v-else-if="scope.row.serveType == 2">规则服务</span>
<span v-else-if="scope.row.serveType == 3">数据服务</span>
<span v-else-if="scope.row.serveType == 4">原子服务</span>
</template>
</el-table-column>
<el-table-column prop="serveRemark" label="服务描述" align="center"></el-table-column>
<el-table-column prop="module" label="模块" align="center"></el-table-column>
<el-table-column label="状态" align="center">
<el-table-column prop="serveState" label="服务类型" align="center">
<template slot-scope="scope">
<span v-if="scope.row.state == 0">已停用</span>
<span v-if="scope.row.state == 1">已发布</span>
<span v-if="scope.row.state == 2">暂存</span>
<span v-if="scope.row.serveState == 1">在建</span>
<span v-else-if="scope.row.serveState == 2">在运</span>
</template>
</el-table-column>
<el-table-column prop="departName" label="归属部门" align="center"></el-table-column>
<el-table-column prop="compName" label="建设单位" align="center"></el-table-column>
<el-table-column prop="publishTime" label="发布时间" align="center" :show-overflow-tooltip="true"></el-table-column>
<el-table-column prop="description" label="简介" align="center"></el-table-column>
<el-table-column prop="inventoryVersion" label="版本" align="center"></el-table-column>
<el-table-column label="操作" width="150" align="center">
<el-table-column label="操作" width="250" align="center">
<template slot-scope="scope">
<div style="display: flex;align-items: center;justify-content: center;">
<el-button icon="el-icon-view" type="primary" size="mini" @click="operate('view',scope.row)">查看</el-button>
<el-button icon="el-icon-upload2" type="primary" size="mini" @click="cancelReleaseItem(scope.row)" v-if="scope.row.state == 1">取消发布</el-button>
<el-button icon="el-icon-upload2" type="primary" size="mini" @click="releaseItem(scope.row)" v-if="scope.row.state != 1">发布</el-button>
</div>
</template>
</el-table-column>
......@@ -104,46 +101,33 @@
<div class="add_dialog_content">
<el-form :model="formData" ref="form">
<div class="form_item_container">
<el-form-item label="案例名称:" prop="tcName">
<el-input v-model="formData.tcName"></el-input>
</el-form-item>
<el-form-item label="案例类型:" prop="tcType">
<el-select v-model="formData.tcType" placeholder="请选择">
<el-option v-for="item in selectData1" :key="item.label" :label="item.label" :value="item.value"></el-option>
</el-select>
<el-form-item label="企业中台:" prop="abilityType">
<el-input v-model="formData.abilityType" readonly></el-input>
</el-form-item>
<el-form-item label="项目类型:" prop="prjType">
<el-select v-model="formData.prjType" placeholder="请选择">
<el-option v-for="item in selectData3" :key="item.label" :label="item.label" :value="item.value"></el-option>
</el-select>
<el-form-item label="中心名称:" prop="departName">
<el-input v-model="formData.departName" readonly></el-input>
</el-form-item>
<el-form-item label="建设内容:" prop="buildContent">
<el-input v-model="formData.buildContent"></el-input>
<el-form-item label="模块:" prop="module">
<el-input v-model="formData.module" readonly></el-input>
</el-form-item>
<el-form-item label="问题类型:" prop="problemType">
<el-select v-model="formData.problemType" placeholder="请选择">
<el-option v-for="item in selectData2" :key="item.label" :label="item.label" :value="item.value"></el-option>
</el-select>
<el-form-item label="服务名称:" prop="inventoryName">
<el-input v-model="formData.inventoryName" readonly></el-input>
</el-form-item>
<el-form-item label="问题等级:" prop="problemLevel">
<el-select v-model="formData.problemLevel" placeholder="请选择">
<el-option v-for="item in selectData4" :key="item.label" :label="item.label" :value="item.value"></el-option>
</el-select>
<el-form-item class="cross1" label="服务描述:" prop="serveRemark">
<el-input type="textarea" readonly v-model="formData.serveRemark" maxlength="200" show-word-limit></el-input>
</el-form-item>
<el-form-item class="cross1" label="架构详情:" prop="archiDetail">
<el-input type="textarea" v-model="formData.archiDetail" maxlength="200" show-word-limit></el-input>
<el-form-item label="服务状态:" prop="serveType">
<el-input v-model="formData.serveType" readonly></el-input>
</el-form-item>
<el-form-item class="cross1" label="问题描述:" prop="problemContent">
<el-input type="textarea" v-model="formData.problemContent" maxlength="200" show-word-limit></el-input>
<el-form-item label="服务类型:" prop="serveState">
<el-input v-model="formData.serveState" readonly></el-input>
</el-form-item>
</div>
</el-form>
</div>
</div>
<span slot="footer" class="dialog-footer">
<el-button class="greenButton" @click="operate('create')">确定</el-button>
<el-button @click="add_dialog = false">取消</el-button>
</span>
</el-dialog>
</div>
</template>
......@@ -199,14 +183,13 @@ export default {
total: 0, //总条数
},
formData: {
tcName: '',
tcType: '',
prjType: '',
buildContent: '',
problemType: '',
problemLevel: '',
problemContent: '',
archiDetail: "",
abilityType: '',
departName: '',
module: '',
inventoryName: '',
serveRemark: '',
serveType: '',
serveState: '',
},
tableHeight: null,
dicObj: {
......@@ -264,14 +247,49 @@ export default {
this.add_dialog = true;
this.title = "新建案例";
this.resetForm();
}else if (type == "edit") {
}else if (type == "view") {
this.add_dialog = true;
this.title = "编辑案例";
this.title = "查看案例";
this.formData = item;
this.formData.tcType = String(this.formData.tcType);
this.formData.problemType = String(this.formData.problemType);
this.formData.prjType = String(this.formData.prjType);
this.formData.problemLevel = String(this.formData.problemLevel);
switch(item.abilityType){
case '1':
this.formData.abilityType = '业务中台服务能力';
break;
case '2':
this.formData.abilityType = '数据中台资源目录';
break;
case '3':
this.formData.abilityType = '数据中台资源服务';
break;
case '4':
this.formData.abilityType = '技术中台公共技术能力';
break;
}
switch(item.serveType){
case 1:
this.formData.serveType = '聚合服务';
break;
case 2:
this.formData.serveType = '规则服务';
break;
case 3:
this.formData.serveType = '数据服务';
break;
case 4:
this.formData.serveType = '原子服务';
break;
}
if(item.serveState == 1) {
this.formData.serveState = '在建';
}else {
this.formData.serveState = '在运';
}
}else if (type == "create") {
if (this.formData.ktcId) {
// 编辑保存
......
<template>
<template>
<div class="currentAssetsList">
<div class="left_container">
<el-tree
class="filter-tree"
:data="treeData"
:highlight-current="true"
:props="{ children: 'subList', label: 'viewName', id: 'viewId' }"
default-expand-all
node-key="viewId"
:default-expanded-keys="treeDefaultExpand"
:current-node-key="currentNodekey"
@node-click="treeClick"
ref="tree">
</el-tree>
</div>
<div class="right_container">
<div class="search_menu">
<div class="search_menu_item_container">
<div class="search_menu_item">
<span class="search_title">架构组件名称</span>
<el-input v-no-backslash v-model="searchParams.assetName" maxlength="100" placeholder="请输入内容" class="search_item"></el-input>
</div>
<div class="search_menu_item">
<span class="search_title">创建人</span>
<el-input v-no-backslash v-model="searchParams.createMan" maxlength="100" placeholder="请输入内容" class="search_item"></el-input>
</div>
<div class="search_menu_item">
<span class="search_title">组件类型</span>
<el-select filterable remote :remote-method="queryZuJianLeiXingSelect" v-model="searchParams.archiEleId" clearable placeholder="请选择" class="search_item">
<el-option v-for="item in zuJianLeiXingSelect" :key="item.typeId" :label="item.elementName" :value="item.typeId"></el-option>
</el-select>
</div>
</div>
<div class="search_menu_btn_container">
<div class="query_btn" @click="search_table">
<img class="btn_icon" src="@/assets/archi-ele-list/search.png" alt="" />
<p>查询</p>
</div>
<div class="reset_btn" @click="reset">
<img class="btn_icon" src="@/assets/archi-ele-list/reset.png" alt="" />
<p>重置</p>
</div>
</div>
</div>
<div class="search_btn">
<!-- <div class="add_btn">
<img class="btn_icon" src="@/assets/archi-ele-list/create.png" alt="" />
<p>新建</p>
</div> -->
<el-button @click="add" type="primary" size="medium" icon="el-icon-document-add">新建</el-button>
<el-button type="primary" size="medium" icon="el-icon-delete" @click="moreDelete">删除</el-button>
<!-- <el-button type="primary" size="medium" icon="el-icon-plus">导入</el-button> -->
<div class="import_btn" @click="importFile">
<img class="btn_icon" src="@/assets/tech-politics-fabric/import.png" alt="" />
<p>导入</p>
</div>
<!-- <el-button type="primary" size="medium" icon="el-icon-plus">导出</el-button> -->
<!-- <div class="import_btn" @click="exportFile" style="margin-left: 0;">
<img class="btn_icon" src="@/assets/tech-politics-fabric/export.png" alt="" />
<p>导出</p>
</div> -->
<div class="import_btn" @click="openDownloadTemplateDialog" style="margin-left: 0;width: 100px;">
<img class="btn_icon" src="@/assets/tech-politics-fabric/export.png" alt="" />
<p>模版下载</p>
</div>
</div>
<el-table :height="tableHeight" @selection-change="select_table_rows" v-loading="loading" :data="tableData" stripe border>
<el-table-column type="selection" width="55"></el-table-column>
<el-table-column type="index" label="序号" width="80" align="center"></el-table-column>
<el-table-column prop="assetName" label="架构组件名称" width="300" :show-overflow-tooltip="true" align="center"></el-table-column>
<el-table-column prop="eleName" label="组件类型" align="center"></el-table-column>
<el-table-column prop="parentAssetName" label="上级架构组件名称" width="300" :show-overflow-tooltip="true" align="center"></el-table-column>
<el-table-column prop="createMan" label="创建人" align="center"></el-table-column>
<el-table-column prop="createTime" label="创建时间" align="center"></el-table-column>
<el-table-column label="操作" width="200" 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="editItem(scope.row)" :disabled="scope.row.state == 1">编辑</el-button>
<el-button class="shanChu_btn" icon="el-icon-delete" size="mini" @click="deleteItem(scope.row)" :disabled="scope.row.state == 1">删除</el-button>
</div>
</template>
</el-table-column>
</el-table>
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pager.current"
:page-sizes="pager.sizes"
:page-size="pager.size"
layout="total, sizes, prev, pager, next, jumper"
:total="pager.total">
</el-pagination>
</div>
<el-dialog
:title="is_add_edit == 'add' ? '新建架构' : '编辑架构'"
:visible.sync="addDialog"
:center="false"
:close-on-click-modal="false"
width="70%">
<el-form :model="ruleForm" :rules="rules" ref="form" style="height: 500px;overflow-y:auto;">
<div class="form_item_container">
<el-form-item label="架构组件名称:" prop="let1">
<el-input placeholder="请输入内容" v-no-backslash v-model="ruleForm.let1" maxlength="100"></el-input>
</el-form-item>
<el-form-item label="上级节点:" prop="let2">
<el-select class="treeSelectClass" clearable placeholder="请选择" v-model="ruleForm.let2">
<!-- <el-option v-for="item in shangJiJieDianSelect" :key="item.assetId" :label="item.assetName" :value="item.assetId"></el-option> -->
<el-option :value="selectValue" :label="selectLabel">
<el-tree
ref="treeSelect"
node-key="assetId"
show-checkbox
:check-strictly="true"
lazy
@check="handleCheckChange"
:data="treeSelectData"
:props="{ children: 'children', label: 'assetName', id: 'assetId' }"
:load="loadTreeSelect">
</el-tree>
</el-option>
</el-select>
</el-form-item>
<!-- <el-form-item label="关联资产:" prop="let6">
<el-select clearable @change="guanLianZiChanChange" filterable remote :remote-method="queryGuanLianZiChan" placeholder="请选择" multiple v-model="ruleForm.let6">
<el-option v-for="item in guanLianZiChanSelect" :key="String(item.assetId)" :label="item.assetName" :value="item.assetId"></el-option>
</el-select>
</el-form-item> -->
<el-form-item label="排序:" prop="let4">
<el-input-number style="width: 200px;" v-model="ruleForm.let4" :min="0"></el-input-number>
</el-form-item>
<el-form-item label="是否首页展示:" prop="let5">
<el-radio-group v-model="ruleForm.let5">
<el-radio label="显示"></el-radio>
<el-radio label="隐藏"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="组件类型:" prop="let3">
<el-select @change="zuJianLeiXingSelectChange" filterable remote :remote-method="queryZuJianLeiXingSelect" clearable placeholder="请选择" v-model="ruleForm.let3">
<el-option v-for="item in zuJianLeiXingSelect" :key="item.typeId" :label="item.elementName" :value="item.typeId"></el-option>
</el-select>
</el-form-item>
<el-form-item class="dynamicFormClass" v-for="(item, index) in ruleForm.dynamicForm0_" :key="index" :label="item.assetName+':'">
<el-input placeholder="请输入内容" v-no-backslash v-model="item.relaName" maxlength="100"></el-input>
</el-form-item>
<el-form-item class="dynamicFormClass" v-for="(item, index) in ruleForm.dynamicForm_" :key="index" :label="item.cnName+':'">
<template v-if="item.controlType == 0">
<el-input placeholder="请输入内容" v-no-backslash v-model="item.value_" maxlength="100"></el-input>
</template>
<template v-else-if="item.controlType == 1">
<el-input placeholder="请输入内容" v-no-backslash v-model="item.value_" type="textarea" :rows="3" maxlength="200" show-word-limit></el-input>
</template>
<template v-else>
<el-select class="selectComponent" v-model="item.value_" clearable>
<el-option v-for="item2 in item.dictArray_" :key="item2.id" :label="item2.label" :value="item2.id"></el-option>
</el-select>
</template>
</el-form-item>
</div>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button class="greenButton" @click="saveDialog">确定</el-button>
<el-button @click="cancelDialog">取消</el-button>
</span>
</el-dialog>
<el-dialog
title="模版下载"
:visible.sync="templateDialog"
:center="false"
:close-on-click-modal="false"
width="60%">
<el-form :model="ruleForm2" ref="form2" :rules="rules2" style="">
<div class="form_item_container">
<el-form-item label="上级节点:" prop="let1">
<el-select clearable placeholder="请选择" v-model="ruleForm2.let1">
<!-- <el-option v-for="item in shangJiJieDianSelect" :key="item.assetId" :label="item.assetName" :value="item.assetId"></el-option> -->
<el-option :value="selectValue2" :label="selectLabel2">
<el-tree
ref="treeSelect2"
node-key="assetId"
show-checkbox
:check-strictly="true"
lazy
@check="handleCheckChange2"
:data="treeSelectData"
:props="{ children: 'children', label: 'assetName', id: 'assetId' }"
:load="loadTreeSelect">
</el-tree>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="组件类型:" prop="let2">
<el-select v-model="ruleForm2.let2" filterable remote :remote-method="queryZuJianLeiXingSelect" clearable placeholder="请选择">
<el-option v-for="item in zuJianLeiXingSelect" :key="item.typeId" :label="item.elementName" :value="item.typeId"></el-option>
</el-select>
</el-form-item>
</div>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button class="greenButton" @click="saveTemplateDialog">确定</el-button>
<el-button @click="templateDialog = false">取消</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import {
getArchiViewManage,
getCurrentZiChanJiaGouTable,
editZiChanJiaGouTable,
deleteMoreZiChanJiaGouTable,
addMoreZiChanJiaGouTable,
queryZiChanJiaGouShangJiJieDian,
queryZiChanJiaGouZuJianLeiXing,
queryZuJianLeiXingBelongForm,
exportZhiChanJiaGou,
getDianXingAnLiSelectData,
importZhiChanJiaGou,
queryGuanLianZiChanSelect
} from '@/api/index.js';
import $ from 'jquery';
import { MessageBox, Message } from 'element-ui';
export default {
name: 'currentAssetsList',
components: {
},
watch: {
},
data() {
return {
selectValue:'',
selectLabel: '',
selectCode: '',
selectValue2:'',
selectLabel2: '',
templateDialog: false,
ruleForm2: {
let1: null,
let2: null,
},
ruleForm: {
let1: null,
let2: null,
let3: null,
let4: 0,
let5: '显示',
let6: '',
dynamicForm0_: [],
dynamicForm_: [],
},
rules: {
let1: [
{ required: true, message: '请输入架构组件名称', trigger: 'blur' },
],
let3: [
{ required: true, message: '请选择节点类型', trigger: 'change' },
],
},
rules2: {
let1: [
{ required: true, message: '请选择上级节点', trigger: 'change' },
],
let2: [
{ required: true, message: '请选择组件类型', trigger: 'change' },
],
},
searchParams: {
archiAssetState: 1,
archiStage: 1,
assetName: null,
createMan: null,
archiEleId: null,
},
treeData: [
{
viewId: 0,
viewName: '总体架构资产',
subList: []
}
],
tableHeight: null,
selectTable: [],
loading: false,
tableData: [],
pager: {
current: 1,
sizes: [10, 20, 50, 100, 200],
size: 10,
total: 0 //总条数
},
addDialog: false,
currentNodekey: null,
is_add_edit: 'add',
zuJianLeiXingSelect: [],
shangJiJieDianSelect: [],
treeDefaultExpand: [],
editId: null,
guanLianZiChanSelect: [],
archiBelongId: null,
assetConstant: null,
// archiAssetTypeId: null,
treeSelectData: [],
};
},
mounted(){
this.getTreeData();
window.addEventListener('resize', () => {
this.set_table_height();
})
this.set_table_height();
},
methods: {
queryGuanLianZiChan(data){
if (data !== '') {
setTimeout(() => {
this.getGuanLianZiChanSelectData(data);
}, 200);
}else {
this.getGuanLianZiChanSelectData(null);
}
},
guanLianZiChanChange(data){//关联资产选择后
let dynamicForm0_Array = [];
if(data.length == 0) {
this.ruleForm.dynamicForm0_ = [];
}else {
data.forEach(item => {
const items = this.guanLianZiChanSelect.find(item2 => item2.assetId == item);
dynamicForm0_Array.push({
assetName: items.assetName,
assetId: items.assetId,
relaName: ''
})
})
this.ruleForm.dynamicForm0_ = dynamicForm0_Array;
}
},
getGuanLianZiChanSelectData(assetName) {//关联资产下拉菜单
const params = {
assetName: assetName,
assetConstant: this.assetConstant
}
queryGuanLianZiChanSelect(params).then(res => {
// console.log(res)
this.guanLianZiChanSelect = res.data;
});
},
saveDialog() {//弹框保存
this.$refs.form.validate(valid => {
if(valid) {
// console.log(this.ruleForm);
let parentAssetName, assetCode, fieldsValue = [], eleName, targetAsset = [];
// if(this.ruleForm.let2 && this.shangJiJieDianSelect.length > 0) {
// const items = this.shangJiJieDianSelect.find(item => item.assetId == this.ruleForm.let2);
// parentAssetName = items.assetName;
// assetCode = items.parentCode;
// }
const items2 = this.zuJianLeiXingSelect.find(item => item.typeId == this.ruleForm.let3);
eleName = items2.elementName;
if(this.ruleForm.dynamicForm_.length > 0) {
this.ruleForm.dynamicForm_.forEach(item => {
fieldsValue.push({
cnName: item.cnName,
value_: item.value_,
controlType: item.controlType,
dictKey: item.dictKey ? item.dictKey : null
})
})
}else {
fieldsValue = [{}];
}
if(this.ruleForm.dynamicForm0_.length > 0) {
this.ruleForm.dynamicForm0_.forEach(item => {
targetAsset.push({
assetName: item.assetName,
assetId: item.assetId,
relaName: item.relaName,
})
})
}else {
targetAsset = [{}];
}
console.log(targetAsset)
const params = {
archiAssetState: this.searchParams.archiAssetState,
archiStage: this.searchParams.archiStage,
archiBelongId: this.archiBelongId,
assetConstant: this.assetConstant,
// archiAssetTypeId: this.archiAssetTypeId,
archiEleId: this.ruleForm.let3,
assetName: this.ruleForm.let1,
sort: this.ruleForm.let4,
assetId: this.is_add_edit == 'add' ? null : this.editId,
parentAssetId: this.selectValue,
parentAssetName: this.selectLabel,
isShow: this.ruleForm.let5 == '显示' ? 0 : 1,
fieldsValue: fieldsValue,
targetAsset: targetAsset,
assetCode: this.selectCode,
eleName: eleName
}
if(this.is_add_edit == 'add') {
addMoreZiChanJiaGouTable(params).then(res => {
if(res.code == 200) {
this.addDialog = false;
this.get_table();
Message({
type: 'success',
message: '新增成功!'
});
}else {
Message({
type: 'error',
message: res.msg
});
}
})
}else {
editZiChanJiaGouTable(params).then(res => {
if(res.code == 200) {
this.addDialog = false;
this.get_table();
Message({
type: 'success',
message: '编辑成功!'
});
}else {
Message({
type: 'error',
message: res.msg
});
}
})
}
}
});
},
cancelDialog() {//弹框取消
this.addDialog = false;
},
// selectable(row) {//表格勾选框禁用
// if(row.state == 1 || row.state == 0) {
// return false; // 禁用
// } else {
// return true; //不禁用
// }
// },
search_table() {//查询
this.pager.current = 1;
this.get_table();
},
reset() {//重置
this.searchParams.assetName = null;
this.searchParams.createMan = null;
this.searchParams.archiEleId = null;
},
// 每页条数改变
handleSizeChange(val) {
this.pager.current = 1;
this.pager.size = val;
this.get_table();
},
//当前页码改变
handleCurrentChange(val) {
this.pager.current = val;
this.get_table();
},
get_table() {//查询表格数据
const params = {
"archiAssetState": this.searchParams.archiAssetState,
"archiStage": this.searchParams.archiStage,
"assetName": this.searchParams.assetName,
"createMan": this.searchParams.createMan,
"archiEleId": this.searchParams.archiEleId,
"assetConstant": this.assetConstant,
// "archiAssetTypeId": this.archiAssetTypeId,
"current": this.pager.current,
"pageSize": this.pager.size,
};
this.loading = true;
getCurrentZiChanJiaGouTable(params).then(res => {
if(res.code == 200) {
this.loading = false;
this.pager.current = res.data.current;
this.pager.total = res.data.total;
this.pager.size = res.data.size;
this.tableData = res.data.records;
}else {
Message({
type: 'error',
message: res.msg
});
}
})
},
openDownloadTemplateDialog() {//打开模版下载窗口
this.templateDialog = true;
this.getShangJiJieDianSelect();
this.$nextTick(() => {
this.$refs.form2.resetFields();
this.ruleForm2.let1 = null;
this.ruleForm2.let2 = null;
this.selectValue2 = '';
this.selectLabel2 = '';
});
},
add() {//新建
this.addDialog = true;
this.is_add_edit = 'add';
this.getShangJiJieDianSelect();
this.$nextTick(() => {
this.$refs.form.resetFields();
this.ruleForm.let1 = null;
this.ruleForm.let2 = null;
this.ruleForm.let3 = null;
this.ruleForm.let4 = 0;
this.ruleForm.let5 = '显示';
this.ruleForm.let6 = null;
this.ruleForm.dynamicForm_ = [];
this.ruleForm.dynamicForm0_ = [];
this.selectLabel = '';
this.selectValue = '';
this.selectCode = '';
});
},
editItem(row){//编辑
this.addDialog = true;
this.is_add_edit = 'edit';
this.ruleForm.let1 = row.assetName;
this.ruleForm.let2 = row.parentAssetName;
this.ruleForm.let3 = row.archiEleId;
this.ruleForm.let4 = row.sort;
this.ruleForm.let5 = row.isShow == 0 ? '显示' : '隐藏';
this.editId = row.assetId;
let fieldsValue = row.fieldsValue;
let targetAsset = row.targetAsset;
this.selectCode = row.assetCode;
this.selectLabel = row.parentAssetName;
this.selectValue = row.parentAssetId;
let targetAsset_id = [];
if(targetAsset.length == 4) {
this.ruleForm.dynamicForm0_ = [];
}else {
let targetAsset_ = JSON.parse(targetAsset);
this.ruleForm.dynamicForm0_ = targetAsset_;
targetAsset_.forEach(item => {
targetAsset_id.push(
item.assetId
)
})
}
this.ruleForm.let6 = targetAsset_id;
if(fieldsValue.length == 4) {
this.ruleForm.dynamicForm_ = [];
}else {
let fieldsValue_ = JSON.parse(fieldsValue);
fieldsValue_.map(item => {
if(item.dictKey) {
this.get_key(item.dictKey).then(res2 => {
this.$set(item, 'dictArray_', res2);
})
}
});
this.ruleForm.dynamicForm_ = fieldsValue_;
}
},
handleCheckChange(data, tree){//上级节点下拉树的勾选
this.selectValue = data.assetId;
this.selectLabel = data.assetName;
this.selectCode = data.assetCode;
this.ruleForm.let2 = data.assetName;
this.$refs.treeSelect.setCheckedKeys([]); // 删除所有选中节点
this.$refs.treeSelect.setCheckedNodes([data]);
},
handleCheckChange2(data, tree){//模版下载的上级节点的下拉树的勾选
this.selectValue2 = data.assetId;
this.selectLabel2 = data.assetName;
this.ruleForm2.let1 = data.assetName;
this.$refs.treeSelect2.setCheckedKeys([]); // 删除所有选中节点
this.$refs.treeSelect2.setCheckedNodes([data]);
},
loadTreeSelect(node, resolve) {//加载上级节点
if (node.level === 0) {
resolve([]);
}else {
const params = {
archiType: this.assetConstant,
parentAssetId: node.data.assetId,
archiAssetState: this.searchParams.archiAssetState,
archiStage: this.searchParams.archiStage,
// archiAssetTypeId: this.archiAssetTypeId,
};
queryZiChanJiaGouShangJiJieDian(params).then(res => {
if(res.code == 200) {
resolve(res.data);
}
})
}
},
getShangJiJieDianSelect() {//上级节点下拉框值
const params = {
archiType: this.assetConstant,
archiAssetState: this.searchParams.archiAssetState,
archiStage: this.searchParams.archiStage,
// parentAssetId: this.archiBelongId,
// archiAssetTypeId: this.archiAssetTypeId,
};
queryZiChanJiaGouShangJiJieDian(params).then(res => {
if(res.code == 200) {
// console.log('上级节点')
// console.log(res.data)
this.shangJiJieDianSelect = res.data;
this.treeSelectData = res.data;
}
})
},
get_key(key) {//查询字典
const params = {
key: key
}
return new Promise((resolve, reject) => {
getDianXingAnLiSelectData(params).then(res => {
if(res.code == 200) {
resolve(res.data);
}
})
})
},
zuJianLeiXingSelectChange(data) {//组件类型选择后
if(data) {
const params = {
type: '1',
typeId: data,
};
queryZuJianLeiXingBelongForm(params).then(res => {
if(res.code == 200) {
if(res.data.length > 0) {
res.data.map(item => {
if(item.controlType == 2) {
this.get_key(item.dictKey).then(res2 => {
this.$set(item, 'dictArray_', res2);
})
}
item['value_'] = '';
});
this.ruleForm.dynamicForm_ = res.data;
}else {
this.ruleForm.dynamicForm_ = [];
}
}
})
}else {
this.ruleForm.dynamicForm_ = [];
}
},
queryZuJianLeiXingSelect(data) {//组件类型搜索
if (data !== '') {
setTimeout(() => {
this.getZuJianLeiXingSelect(data);
}, 200);
}else {
this.getZuJianLeiXingSelect(null);
}
},
getZuJianLeiXingSelect(elementName) {//组件类型下拉框值
const params = {
state: '1',
type: '1',
elementName: elementName,
archiBelongId: this.archiBelongId
};
queryZiChanJiaGouZuJianLeiXing(params).then(res => {
if(res.code == 200) {
// console.log('组件类型')
// console.log(res.data)
this.zuJianLeiXingSelect = res.data;
}else {
Message({
type: 'error',
message: res.msg
});
}
})
},
moreDelete() {//批量删除
if(this.selectTable.length == 0) {
Message({
type: 'error',
message: '请选择至少一条数据!'
});
}else {
let assetIdArray = [];
this.selectTable.forEach(item => {
assetIdArray.push(item.assetId);
});
const params = {
assetId: assetIdArray,
assetConstant: this.assetConstant,
// archiAssetTypeId: this.archiAssetTypeId,
};
MessageBox.confirm('确定删除?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
customClass: 'messageClass',
confirmButtonClass: 'confirmClass',
type: 'warning'
}).then(() => {
deleteMoreZiChanJiaGouTable(params).then(res => {
if(res.code == 200) {
this.get_table();
Message({
type: 'success',
message: '删除成功!'
});
}else {
Message({
type: 'error',
message: res.msg
});
}
})
}).catch(() => {
Message({
type: 'info',
message: '已取消'
});
});
}
},
importFile() {//导入
const inpEle = document.createElement("input");
inpEle.type = "file";
inpEle.style.display = "none";
inpEle.addEventListener("change", event => {
// console.log(event.target.files[0]);
var formData = new FormData();
formData.append("file", event.target.files[0]);
formData.append("typeCode", this.assetConstant);
importZhiChanJiaGou(formData).then(res => {
if(res.code == 200) {
this.get_table();
Message({
type: 'success',
message: '导入成功!'
});
}
});
});
inpEle.click();
},
saveTemplateDialog() {//下载模版
this.$refs.form2.validate(valid => {
if(valid) {
// const items = this.shangJiJieDianSelect.find(item => item.assetId == this.ruleForm2.let1);
// let parentName = items.assetName;
const params = {
parentId: this.selectValue2,
parentName: this.selectLabel2,
typeId: this.ruleForm2.let2
}
// const params = {
// parentId: '1',
// parentName: '应用架构A',
// typeId: 149
// }
// console.log(params)
exportZhiChanJiaGou(params).then(res => {
let blob = new Blob([res], { type: 'application/octet-stream' });
let url = URL.createObjectURL(blob);
let link = document.createElement('a');
link.href = url;
link.download = '模版文件.xls';
document.body.appendChild(link);
link.click();
this.templateDialog = false;
});
}
});
},
deleteItem(row){//删除
MessageBox.confirm('确定删除?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
customClass: 'messageClass',
confirmButtonClass: 'confirmClass',
type: 'warning'
}).then(() => {
const params = {
assetId: [row.assetId],
assetConstant: this.assetConstant,
// archiAssetTypeId: this.archiAssetTypeId,
}
deleteMoreZiChanJiaGouTable(params).then(res => {
if(res.code == 200) {
this.get_table();
Message({
type: 'success',
message: '删除成功!'
});
}else{
Message({
type: 'error',
message: res.msg
});
}
});
}).catch(() => {
Message({
type: 'info',
message: '已取消'
});
});
},
select_table_rows(data){//表格的勾选
this.selectTable = data;
},
set_table_height() {//动态设置表格高度
const right_container_height = $(".right_container").height();
this.tableHeight = right_container_height - 260 + 'px';
},
treeClick(data) {//左侧树点击
if(!data.archiBelongId) return;
this.archiBelongId = data.archiBelongId;
this.assetConstant = data.assetConstant;
// this.archiAssetTypeId = data.viewId;
this.getZuJianLeiXingSelect(null);
this.get_table();
},
getTreeData() {//查询左侧树
getArchiViewManage({}).then(res => {
if(res.code == 200) {
this.treeDefaultExpand = [res.data[0].viewId];
this.currentNodekey = res.data[0].viewId;
this.$nextTick(() => {
this.$refs.tree.setCurrentKey(this.currentNodekey);
});
res.data.map(item => {
item.subList = [];
switch(item.viewName){
case '安全架构':
item['assetConstant'] = 'ARCHI_SAFE';
item['archiBelongId'] = 5;
break;
case '技术架构':
item['assetConstant'] = 'ARCHI_TECHNOLOGY';
item['archiBelongId'] = 4;
break;
case '数据架构':
item['assetConstant'] = 'ARCHI_DATA';
item['archiBelongId'] = 3;
break;
case '应用架构':
item['assetConstant'] = 'ARCHI_APPLICATION';
item['archiBelongId'] = 2;
break;
case '业务架构':
item['assetConstant'] = 'ARCHI_BUSINESS';
item['archiBelongId'] = 1;
break;
}
});
// res.data.map(item => {
// switch(item.viewName){
// case '安全架构':
// item.subList.map(item2 => {
// item2['assetConstant'] = 'ARCHI_SAFE';
// item2['archiBelongId'] = 5;
// })
// break;
// case '技术架构':
// item.subList.map(item2 => {
// item2['assetConstant'] = 'ARCHI_TECHNOLOGY';
// item2['archiBelongId'] = 4;
// })
// break;
// case '数据架构':
// item.subList.map(item2 => {
// item2['assetConstant'] = 'ARCHI_DATA';
// item2['archiBelongId'] = 3;
// })
// break;
// case '应用架构':
// item.subList.map(item2 => {
// item2['assetConstant'] = 'ARCHI_APPLICATION';
// item2['archiBelongId'] = 2;
// })
// break;
// case '业务架构':
// item.subList.map(item2 => {
// item2['assetConstant'] = 'ARCHI_BUSINESS';
// item2['archiBelongId'] = 1;
// })
// break;
// }
// });
this.treeData[0].subList = res.data;
this.archiBelongId = res.data[0].archiBelongId;
this.assetConstant = res.data[0].assetConstant;
// this.archiAssetTypeId = res.data[0].viewId;
this.getShangJiJieDianSelect();
this.getZuJianLeiXingSelect(null);
this.getGuanLianZiChanSelectData(null);
this.get_table();
}else {
Message({
type: 'error',
message: res.msg
});
}
});
},
}
}
</script>
<style>
.confirmClass{
background-color: #0D867F !important;
}
.el-message-box__content{
padding: 60px 15px 60px 15px;
}
.el-select-dropdown__item{
height: auto;
}
.el-select-dropdown__item.hover, .el-select-dropdown__item:hover{
background-color: #fff !important;
}
</style>
<style scoped>
.filter-tree{
width: 300px;
height: 100%;
overflow-y: auto;
}
.dynamicFormClass{
width: 100% !important;
}
/deep/ .el-tree-node__expand-icon {
column-count: #01b7c9;
}
/deep/ .el-tree-node__expand-icon.is-leaf {
color: transparent !important;
}
/deep/ .dynamicFormClass .el-form-item__content {
width: calc(100% - 210px) !important;
text-align: left;
}
.el-form-item{
display: flex;
width: 33%;
}
/deep/ .el-form-item__label{
width: 160px;
}
.form_item_container{
display: flex;
flex-wrap: wrap;
}
.greenButton{
background-color: #0D867F;
color: #fff;
}
/deep/ .el-dialog__header{
background-color: #0D867F;
text-align: left;
}
/deep/ .el-dialog__title{
color: #fff;
}
/deep/ .el-dialog__close {
color: #fff;
}
.el-pagination{
margin-top: 30px;
}
/deep/ .el-pagination.is-background .el-pager li:not(.disabled).active{
background-color: #0D867F;
}
.shanChu_btn{
color: #DD6A15;
background-color: #F8EBE2;
}
.table_container{
width: 97%;
height: calc(100% - 40px);
margin-top: 20px;
}
/deep/ .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content{
background-color: #0D867F;
color: #fff;
}
/deep/ .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content >.is-leaf{
background-color: #0D867F !important;
}
/deep/ .is-leaf {
background-color: #fff !important;
}
.currentAssetsList{
width: 100%;
/* height: calc(100% - 20px); */
height: 100%;
display: flex;
/* padding-right: 20px;
padding-left: 20px;
padding-bottom: 20px; */
}
.left_container{
width: 20%;
margin-right: 20px;
}
.right_container{
width: 80%;
}
.search_menu{
margin-top: 20px;
margin-right: 20px;
display: flex;
justify-content: space-between;
}
.search_menu_item_container{
display: flex;
align-items: center;
}
.search_menu_btn_container{
display: flex;
align-items: center;
}
.search_menu_item{
display: flex;
align-items: center;
width: 344px;
}
.search_title{
/* width: 20%; */
flex-shrink: 0;
margin-right: 15px;
}
.search_item{
width: 60%;
}
.search_btn{
width: 100%;
display: flex;
margin-top: 50px;
margin-bottom: 20px;
}
.import_btn{
display: flex;
align-items: center;
justify-content: center;
width: 86px;
height: 36px;
margin: 0 10px;
background: rgba(13,134,127,0.1);
border-radius: 6px 6px 6px 6px;
font-size: 14px;
color: #0D867F;
cursor: pointer;
}
.btn_icon{
margin-right: 10px;
}
.query_btn{
display: flex;
align-items: center;
justify-content: center;
width: 76px;
height: 32px;
background: rgba(13,134,127,1);
border-radius: 6px 6px 6px 6px;
border: 1px solid #0D867F;
font-size: 14px;
color: #fff;
margin-right: 10px;
cursor: pointer;
}
.reset_btn{
display: flex;
align-items: center;
justify-content: center;
width: 76px;
height: 32px;
background: rgba(244,244,244,1);
border-radius: 6px 6px 6px 6px;
border: 1px solid #ccc;
font-size: 14px;
color: #666;
cursor: pointer;
}
.el-button--primary{
background: rgba(13,134,127,0.1);
color: #0D867F;
border: 0;
}
</style>
\ No newline at end of file
<template>
<div class="busiAssetslist">
<div class="left_container">
<el-tree
class="filter-tree"
:data="treeData"
:highlight-current="true"
:props="{ children: 'subList', label: 'viewName', id: 'viewId' }"
default-expand-all
node-key="viewId"
:default-expanded-keys="treeDefaultExpand"
:current-node-key="currentNodekey"
@node-click="treeClick"
ref="tree">
</el-tree>
</div>
<div class="right_container">
<div class="search_menu">
<div class="search_menu_item_container">
<div class="search_menu_item">
<span class="search_title">架构组件名称</span>
<el-input v-no-backslash v-model="searchParams.assetName" maxlength="100" placeholder="请输入内容" class="search_item"></el-input>
</div>
<div class="search_menu_item">
<span class="search_title">创建人</span>
<el-input v-no-backslash v-model="searchParams.createMan" maxlength="100" placeholder="请输入内容" class="search_item"></el-input>
</div>
<div class="search_menu_item">
<span class="search_title">组件类型</span>
<el-select filterable remote :remote-method="queryZuJianLeiXingSelect" v-model="searchParams.archiEleId" clearable placeholder="请选择" class="search_item">
<el-option v-for="item in zuJianLeiXingSelect" :key="item.typeId" :label="item.elementName" :value="item.typeId"></el-option>
</el-select>
</div>
</div>
<div class="search_menu_btn_container">
<div class="query_btn" @click="search_table">
<img class="btn_icon" src="@/assets/archi-ele-list/search.png" alt="" />
<p>查询</p>
</div>
<div class="reset_btn" @click="reset">
<img class="btn_icon" src="@/assets/archi-ele-list/reset.png" alt="" />
<p>重置</p>
</div>
</div>
</div>
<div class="search_btn">
<!-- <div class="add_btn">
<img class="btn_icon" src="@/assets/archi-ele-list/create.png" alt="" />
<p>新建</p>
</div> -->
<el-button @click="add" type="primary" size="medium" icon="el-icon-document-add">新建</el-button>
<el-button type="primary" size="medium" icon="el-icon-delete" @click="moreDelete">删除</el-button>
<!-- <el-button type="primary" size="medium" icon="el-icon-plus">导入</el-button> -->
<div class="import_btn" @click="importFile">
<img class="btn_icon" src="@/assets/tech-politics-fabric/import.png" alt="" />
<p>导入</p>
</div>
<!-- <el-button type="primary" size="medium" icon="el-icon-plus">导出</el-button> -->
<!-- <div class="import_btn" @click="exportFile" style="margin-left: 0;">
<img class="btn_icon" src="@/assets/tech-politics-fabric/export.png" alt="" />
<p>导出</p>
</div> -->
<div class="import_btn" @click="openDownloadTemplateDialog" style="margin-left: 0;width: 100px;">
<img class="btn_icon" src="@/assets/tech-politics-fabric/export.png" alt="" />
<p>模版下载</p>
</div>
</div>
<el-table :height="tableHeight" @selection-change="select_table_rows" v-loading="loading" :data="tableData" stripe border>
<el-table-column type="selection" width="55"></el-table-column>
<el-table-column type="index" label="序号" width="80" align="center"></el-table-column>
<el-table-column prop="assetName" label="架构组件名称" width="300" :show-overflow-tooltip="true" align="center"></el-table-column>
<el-table-column prop="eleName" label="组件类型" align="center"></el-table-column>
<el-table-column prop="parentAssetName" label="上级架构组件名称" width="300" :show-overflow-tooltip="true" align="center"></el-table-column>
<el-table-column prop="createMan" label="创建人" align="center"></el-table-column>
<el-table-column prop="createTime" label="创建时间" align="center"></el-table-column>
<el-table-column label="操作" width="200" 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="editItem(scope.row)" :disabled="scope.row.state == 1">编辑</el-button>
<el-button class="shanChu_btn" icon="el-icon-delete" size="mini" @click="deleteItem(scope.row)" :disabled="scope.row.state == 1">删除</el-button>
</div>
</template>
</el-table-column>
</el-table>
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pager.current"
:page-sizes="pager.sizes"
:page-size="pager.size"
layout="total, sizes, prev, pager, next, jumper"
:total="pager.total">
</el-pagination>
</div>
<el-dialog
:title="is_add_edit == 'add' ? '新建架构' : '编辑架构'"
:visible.sync="addDialog"
:center="false"
:close-on-click-modal="false"
width="70%">
<el-form :model="ruleForm" :rules="rules" ref="form" style="height: 500px;overflow-y:auto;">
<div class="form_item_container">
<el-form-item label="架构组件名称:" prop="let1">
<el-input placeholder="请输入内容" v-no-backslash v-model="ruleForm.let1" maxlength="100"></el-input>
</el-form-item>
<el-form-item label="上级节点:" prop="let2">
<el-select class="treeSelectClass" clearable placeholder="请选择" v-model="ruleForm.let2">
<!-- <el-option v-for="item in shangJiJieDianSelect" :key="item.assetId" :label="item.assetName" :value="item.assetId"></el-option> -->
<el-option :value="selectValue" :label="selectLabel">
<el-tree
ref="treeSelect"
node-key="assetId"
show-checkbox
:check-strictly="true"
lazy
@check="handleCheckChange"
:data="treeSelectData"
:props="{ children: 'children', label: 'assetName', id: 'assetId' }"
:load="loadTreeSelect">
</el-tree>
</el-option>
</el-select>
</el-form-item>
<!-- <el-form-item label="关联资产:" prop="let6">
<el-select clearable @change="guanLianZiChanChange" filterable remote :remote-method="queryGuanLianZiChan" placeholder="请选择" multiple v-model="ruleForm.let6">
<el-option v-for="item in guanLianZiChanSelect" :key="String(item.assetId)" :label="item.assetName" :value="item.assetId"></el-option>
</el-select>
</el-form-item> -->
<el-form-item label="排序:" prop="let4">
<el-input-number style="width: 200px;" v-model="ruleForm.let4" :min="0"></el-input-number>
</el-form-item>
<el-form-item label="是否首页展示:" prop="let5">
<el-radio-group v-model="ruleForm.let5">
<el-radio label="显示"></el-radio>
<el-radio label="隐藏"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="组件类型:" prop="let3">
<el-select @change="zuJianLeiXingSelectChange" filterable remote :remote-method="queryZuJianLeiXingSelect" clearable placeholder="请选择" v-model="ruleForm.let3">
<el-option v-for="item in zuJianLeiXingSelect" :key="item.typeId" :label="item.elementName" :value="item.typeId"></el-option>
</el-select>
</el-form-item>
<el-form-item class="dynamicFormClass" v-for="(item, index) in ruleForm.dynamicForm0_" :key="index" :label="item.assetName+':'">
<el-input placeholder="请输入内容" v-no-backslash v-model="item.relaName" maxlength="100"></el-input>
</el-form-item>
<el-form-item class="dynamicFormClass" v-for="(item, index) in ruleForm.dynamicForm_" :key="index" :label="item.cnName+':'">
<template v-if="item.controlType == 0">
<el-input placeholder="请输入内容" v-no-backslash v-model="item.value_" maxlength="100"></el-input>
</template>
<template v-else-if="item.controlType == 1">
<el-input placeholder="请输入内容" v-no-backslash v-model="item.value_" type="textarea" :rows="3" maxlength="200" show-word-limit></el-input>
</template>
<template v-else>
<el-select class="selectComponent" v-model="item.value_" clearable>
<el-option v-for="item2 in item.dictArray_" :key="item2.id" :label="item2.label" :value="item2.id"></el-option>
</el-select>
</template>
</el-form-item>
</div>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button class="greenButton" @click="saveDialog">确定</el-button>
<el-button @click="cancelDialog">取消</el-button>
</span>
</el-dialog>
<el-dialog
title="模版下载"
:visible.sync="templateDialog"
:center="false"
:close-on-click-modal="false"
width="60%">
<el-form :model="ruleForm2" ref="form2" :rules="rules2" style="">
<div class="form_item_container">
<el-form-item label="上级节点:" prop="let1">
<el-select clearable placeholder="请选择" v-model="ruleForm2.let1">
<!-- <el-option v-for="item in shangJiJieDianSelect" :key="item.assetId" :label="item.assetName" :value="item.assetId"></el-option> -->
<el-option :value="selectValue2" :label="selectLabel2">
<el-tree
ref="treeSelect2"
node-key="assetId"
show-checkbox
:check-strictly="true"
lazy
@check="handleCheckChange2"
:data="treeSelectData"
:props="{ children: 'children', label: 'assetName', id: 'assetId' }"
:load="loadTreeSelect">
</el-tree>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="组件类型:" prop="let2">
<el-select v-model="ruleForm2.let2" filterable remote :remote-method="queryZuJianLeiXingSelect" clearable placeholder="请选择">
<el-option v-for="item in zuJianLeiXingSelect" :key="item.typeId" :label="item.elementName" :value="item.typeId"></el-option>
</el-select>
</el-form-item>
</div>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button class="greenButton" @click="saveTemplateDialog">确定</el-button>
<el-button @click="templateDialog = false">取消</el-button>
</span>
</el-dialog>
<div class="currentAssetsList">
<el-tabs>
<el-tab-pane label="业务需求">
<Tab1></Tab1>
</el-tab-pane>
<el-tab-pane label="应用功能">
<Tab2></Tab2>
</el-tab-pane>
<el-tab-pane label="数据实体">
<Tab3></Tab3>
</el-tab-pane>
<el-tab-pane label="技术组件">
<Tab4></Tab4>
</el-tab-pane>
<el-tab-pane label="安全防护措施">
<Tab5></Tab5>
</el-tab-pane>
</el-tabs>
</div>
</template>
<script>
import Tab1 from './tab1.vue';
import Tab2 from './tab2.vue';
import Tab3 from './tab3.vue';
import Tab4 from './tab4.vue';
import Tab5 from './tab5.vue';
import { MessageBox, Message } from 'element-ui';
import $ from 'jquery';
import {
getArchiViewManage,
getCurrentZiChanJiaGouTable,
editZiChanJiaGouTable,
deleteMoreZiChanJiaGouTable,
addMoreZiChanJiaGouTable,
queryZiChanJiaGouShangJiJieDian,
queryZiChanJiaGouZuJianLeiXing,
queryZuJianLeiXingBelongForm,
exportZhiChanJiaGou,
getDianXingAnLiSelectData,
importZhiChanJiaGou,
queryGuanLianZiChanSelect
saveArchiViewManageCardDetails
} from '@/api/index.js';
import $ from 'jquery';
import { MessageBox, Message } from 'element-ui';
export default {
name: 'BusiAssetslist',
name: 'currentAssetsList',
components: {
},
watch: {
Tab1,
Tab2,
Tab3,
Tab4,
Tab5,
},
data() {
return {
selectValue:'',
selectLabel: '',
selectCode: '',
selectValue2:'',
selectLabel2: '',
templateDialog: false,
ruleForm2: {
let1: null,
let2: null,
},
ruleForm: {
let1: null,
let2: null,
let3: null,
let4: 0,
let5: '显示',
let6: '',
dynamicForm0_: [],
dynamicForm_: [],
},
rules: {
let1: [
{ required: true, message: '请输入架构组件名称', trigger: 'blur' },
],
let3: [
{ required: true, message: '请选择节点类型', trigger: 'change' },
],
},
rules2: {
let1: [
{ required: true, message: '请选择上级节点', trigger: 'change' },
],
let2: [
{ required: true, message: '请选择组件类型', trigger: 'change' },
],
},
searchParams: {
archiAssetState: 1,
archiStage: 1,
assetName: null,
createMan: null,
archiEleId: null,
},
treeData: [
{
viewId: 0,
viewName: '总体架构资产',
subList: []
}
],
tableHeight: null,
selectTable: [],
loading: false,
tableData: [],
pager: {
current: 1,
sizes: [10, 20, 50, 100, 200],
size: 10,
total: 0 //总条数
},
addDialog: false,
currentNodekey: null,
is_add_edit: 'add',
zuJianLeiXingSelect: [],
shangJiJieDianSelect: [],
treeDefaultExpand: [],
editId: null,
guanLianZiChanSelect: [],
archiBelongId: null,
assetConstant: null,
// archiAssetTypeId: null,
treeSelectData: [],
routerId: null,
};
},
mounted(){
this.getTreeData();
window.addEventListener('resize', () => {
this.set_table_height();
})
this.set_table_height();
},
methods: {
queryGuanLianZiChan(data){
if (data !== '') {
setTimeout(() => {
this.getGuanLianZiChanSelectData(data);
}, 200);
}else {
this.getGuanLianZiChanSelectData(null);
}
},
guanLianZiChanChange(data){//关联资产选择后
let dynamicForm0_Array = [];
if(data.length == 0) {
this.ruleForm.dynamicForm0_ = [];
}else {
data.forEach(item => {
const items = this.guanLianZiChanSelect.find(item2 => item2.assetId == item);
dynamicForm0_Array.push({
assetName: items.assetName,
assetId: items.assetId,
relaName: ''
})
})
this.ruleForm.dynamicForm0_ = dynamicForm0_Array;
}
},
getGuanLianZiChanSelectData(assetName) {//关联资产下拉菜单
const params = {
assetName: assetName,
assetConstant: this.assetConstant
}
queryGuanLianZiChanSelect(params).then(res => {
// console.log(res)
this.guanLianZiChanSelect = res.data;
});
},
saveDialog() {//弹框保存
this.$refs.form.validate(valid => {
if(valid) {
// console.log(this.ruleForm);
let parentAssetName, assetCode, fieldsValue = [], eleName, targetAsset = [];
// if(this.ruleForm.let2 && this.shangJiJieDianSelect.length > 0) {
// const items = this.shangJiJieDianSelect.find(item => item.assetId == this.ruleForm.let2);
// parentAssetName = items.assetName;
// assetCode = items.parentCode;
// }
const items2 = this.zuJianLeiXingSelect.find(item => item.typeId == this.ruleForm.let3);
eleName = items2.elementName;
if(this.ruleForm.dynamicForm_.length > 0) {
this.ruleForm.dynamicForm_.forEach(item => {
fieldsValue.push({
cnName: item.cnName,
value_: item.value_,
controlType: item.controlType,
dictKey: item.dictKey ? item.dictKey : null
})
})
}else {
fieldsValue = [{}];
}
if(this.ruleForm.dynamicForm0_.length > 0) {
this.ruleForm.dynamicForm0_.forEach(item => {
targetAsset.push({
assetName: item.assetName,
assetId: item.assetId,
relaName: item.relaName,
})
})
}else {
targetAsset = [{}];
}
console.log(targetAsset)
const params = {
archiAssetState: this.searchParams.archiAssetState,
archiStage: this.searchParams.archiStage,
archiBelongId: this.archiBelongId,
assetConstant: this.assetConstant,
// archiAssetTypeId: this.archiAssetTypeId,
archiEleId: this.ruleForm.let3,
assetName: this.ruleForm.let1,
sort: this.ruleForm.let4,
assetId: this.is_add_edit == 'add' ? null : this.editId,
parentAssetId: this.selectValue,
parentAssetName: this.selectLabel,
isShow: this.ruleForm.let5 == '显示' ? 0 : 1,
fieldsValue: fieldsValue,
targetAsset: targetAsset,
assetCode: this.selectCode,
eleName: eleName
}
if(this.is_add_edit == 'add') {
addMoreZiChanJiaGouTable(params).then(res => {
if(res.code == 200) {
this.addDialog = false;
this.get_table();
Message({
type: 'success',
message: '新增成功!'
});
}else {
Message({
type: 'error',
message: res.msg
});
}
})
}else {
editZiChanJiaGouTable(params).then(res => {
if(res.code == 200) {
this.addDialog = false;
this.get_table();
Message({
type: 'success',
message: '编辑成功!'
});
}else {
Message({
type: 'error',
message: res.msg
});
}
})
}
}
});
},
cancelDialog() {//弹框取消
this.addDialog = false;
},
// selectable(row) {//表格勾选框禁用
// if(row.state == 1 || row.state == 0) {
// return false; // 禁用
// } else {
// return true; //不禁用
// }
// },
search_table() {//查询
this.pager.current = 1;
this.get_table();
},
reset() {//重置
this.searchParams.assetName = null;
this.searchParams.createMan = null;
this.searchParams.archiEleId = null;
},
// 每页条数改变
handleSizeChange(val) {
this.pager.current = 1;
this.pager.size = val;
this.get_table();
},
//当前页码改变
handleCurrentChange(val) {
this.pager.current = val;
this.get_table();
},
get_table() {//查询表格数据
const params = {
"archiAssetState": this.searchParams.archiAssetState,
"archiStage": this.searchParams.archiStage,
"assetName": this.searchParams.assetName,
"createMan": this.searchParams.createMan,
"archiEleId": this.searchParams.archiEleId,
"assetConstant": this.assetConstant,
// "archiAssetTypeId": this.archiAssetTypeId,
"current": this.pager.current,
"pageSize": this.pager.size,
};
this.loading = true;
getCurrentZiChanJiaGouTable(params).then(res => {
if(res.code == 200) {
this.loading = false;
this.pager.current = res.data.current;
this.pager.total = res.data.total;
this.pager.size = res.data.size;
this.tableData = res.data.records;
}else {
Message({
type: 'error',
message: res.msg
});
}
})
},
openDownloadTemplateDialog() {//打开模版下载窗口
this.templateDialog = true;
this.getShangJiJieDianSelect();
this.$nextTick(() => {
this.$refs.form2.resetFields();
this.ruleForm2.let1 = null;
this.ruleForm2.let2 = null;
this.selectValue2 = '';
this.selectLabel2 = '';
});
},
add() {//新建
this.addDialog = true;
this.is_add_edit = 'add';
this.getShangJiJieDianSelect();
this.$nextTick(() => {
this.$refs.form.resetFields();
this.ruleForm.let1 = null;
this.ruleForm.let2 = null;
this.ruleForm.let3 = null;
this.ruleForm.let4 = 0;
this.ruleForm.let5 = '显示';
this.ruleForm.let6 = null;
this.ruleForm.dynamicForm_ = [];
this.ruleForm.dynamicForm0_ = [];
this.selectLabel = '';
this.selectValue = '';
this.selectCode = '';
});
},
editItem(row){//编辑
this.addDialog = true;
this.is_add_edit = 'edit';
this.ruleForm.let1 = row.assetName;
this.ruleForm.let2 = row.parentAssetName;
this.ruleForm.let3 = row.archiEleId;
this.ruleForm.let4 = row.sort;
this.ruleForm.let5 = row.isShow == 0 ? '显示' : '隐藏';
this.editId = row.assetId;
let fieldsValue = row.fieldsValue;
let targetAsset = row.targetAsset;
this.selectCode = row.assetCode;
this.selectLabel = row.parentAssetName;
this.selectValue = row.parentAssetId;
let targetAsset_id = [];
if(targetAsset.length == 4) {
this.ruleForm.dynamicForm0_ = [];
}else {
let targetAsset_ = JSON.parse(targetAsset);
this.ruleForm.dynamicForm0_ = targetAsset_;
targetAsset_.forEach(item => {
targetAsset_id.push(
item.assetId
)
})
}
this.ruleForm.let6 = targetAsset_id;
if(fieldsValue.length == 4) {
this.ruleForm.dynamicForm_ = [];
}else {
let fieldsValue_ = JSON.parse(fieldsValue);
fieldsValue_.map(item => {
if(item.dictKey) {
this.get_key(item.dictKey).then(res2 => {
this.$set(item, 'dictArray_', res2);
})
}
});
this.ruleForm.dynamicForm_ = fieldsValue_;
}
},
handleCheckChange(data, tree){//上级节点下拉树的勾选
this.selectValue = data.assetId;
this.selectLabel = data.assetName;
this.selectCode = data.assetCode;
this.ruleForm.let2 = data.assetName;
this.$refs.treeSelect.setCheckedKeys([]); // 删除所有选中节点
this.$refs.treeSelect.setCheckedNodes([data]);
},
handleCheckChange2(data, tree){//模版下载的上级节点的下拉树的勾选
this.selectValue2 = data.assetId;
this.selectLabel2 = data.assetName;
this.ruleForm2.let1 = data.assetName;
this.$refs.treeSelect2.setCheckedKeys([]); // 删除所有选中节点
this.$refs.treeSelect2.setCheckedNodes([data]);
},
loadTreeSelect(node, resolve) {//加载上级节点
if (node.level === 0) {
resolve([]);
}else {
const params = {
archiType: this.assetConstant,
parentAssetId: node.data.assetId,
archiAssetState: this.searchParams.archiAssetState,
archiStage: this.searchParams.archiStage,
// archiAssetTypeId: this.archiAssetTypeId,
};
queryZiChanJiaGouShangJiJieDian(params).then(res => {
if(res.code == 200) {
resolve(res.data);
}
})
}
},
getShangJiJieDianSelect() {//上级节点下拉框值
const params = {
archiType: this.assetConstant,
archiAssetState: this.searchParams.archiAssetState,
archiStage: this.searchParams.archiStage,
// parentAssetId: this.archiBelongId,
// archiAssetTypeId: this.archiAssetTypeId,
};
queryZiChanJiaGouShangJiJieDian(params).then(res => {
if(res.code == 200) {
// console.log('上级节点')
// console.log(res.data)
this.shangJiJieDianSelect = res.data;
this.treeSelectData = res.data;
}
})
},
get_key(key) {//查询字典
const params = {
key: key
}
return new Promise((resolve, reject) => {
getDianXingAnLiSelectData(params).then(res => {
if(res.code == 200) {
resolve(res.data);
}
})
})
},
zuJianLeiXingSelectChange(data) {//组件类型选择后
if(data) {
const params = {
type: '1',
typeId: data,
};
queryZuJianLeiXingBelongForm(params).then(res => {
if(res.code == 200) {
if(res.data.length > 0) {
res.data.map(item => {
if(item.controlType == 2) {
this.get_key(item.dictKey).then(res2 => {
this.$set(item, 'dictArray_', res2);
})
}
item['value_'] = '';
});
this.ruleForm.dynamicForm_ = res.data;
}else {
this.ruleForm.dynamicForm_ = [];
}
}
})
}else {
this.ruleForm.dynamicForm_ = [];
}
},
queryZuJianLeiXingSelect(data) {//组件类型搜索
if (data !== '') {
setTimeout(() => {
this.getZuJianLeiXingSelect(data);
}, 200);
}else {
this.getZuJianLeiXingSelect(null);
}
},
getZuJianLeiXingSelect(elementName) {//组件类型下拉框值
const params = {
state: '1',
type: '1',
elementName: elementName,
archiBelongId: this.archiBelongId
};
queryZiChanJiaGouZuJianLeiXing(params).then(res => {
if(res.code == 200) {
// console.log('组件类型')
// console.log(res.data)
this.zuJianLeiXingSelect = res.data;
}else {
Message({
type: 'error',
message: res.msg
});
}
})
},
moreDelete() {//批量删除
if(this.selectTable.length == 0) {
Message({
type: 'error',
message: '请选择至少一条数据!'
});
}else {
let assetIdArray = [];
this.selectTable.forEach(item => {
assetIdArray.push(item.assetId);
});
const params = {
assetId: assetIdArray,
assetConstant: this.assetConstant,
// archiAssetTypeId: this.archiAssetTypeId,
};
MessageBox.confirm('确定删除?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
customClass: 'messageClass',
confirmButtonClass: 'confirmClass',
type: 'warning'
}).then(() => {
deleteMoreZiChanJiaGouTable(params).then(res => {
if(res.code == 200) {
this.get_table();
Message({
type: 'success',
message: '删除成功!'
});
}else {
Message({
type: 'error',
message: res.msg
});
}
})
}).catch(() => {
Message({
type: 'info',
message: '已取消'
});
});
}
},
importFile() {//导入
const inpEle = document.createElement("input");
inpEle.type = "file";
inpEle.style.display = "none";
inpEle.addEventListener("change", event => {
// console.log(event.target.files[0]);
var formData = new FormData();
formData.append("file", event.target.files[0]);
formData.append("typeCode", this.assetConstant);
importZhiChanJiaGou(formData).then(res => {
if(res.code == 200) {
this.get_table();
Message({
type: 'success',
message: '导入成功!'
});
}
});
});
inpEle.click();
},
saveTemplateDialog() {//下载模版
this.$refs.form2.validate(valid => {
if(valid) {
// const items = this.shangJiJieDianSelect.find(item => item.assetId == this.ruleForm2.let1);
// let parentName = items.assetName;
const params = {
parentId: this.selectValue2,
parentName: this.selectLabel2,
typeId: this.ruleForm2.let2
}
// const params = {
// parentId: '1',
// parentName: '应用架构A',
// typeId: 149
// }
// console.log(params)
exportZhiChanJiaGou(params).then(res => {
let blob = new Blob([res], { type: 'application/octet-stream' });
let url = URL.createObjectURL(blob);
let link = document.createElement('a');
link.href = url;
link.download = '模版文件.xls';
document.body.appendChild(link);
link.click();
this.templateDialog = false;
});
}
});
},
deleteItem(row){//删除
MessageBox.confirm('确定删除?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
customClass: 'messageClass',
confirmButtonClass: 'confirmClass',
type: 'warning'
}).then(() => {
const params = {
assetId: [row.assetId],
assetConstant: this.assetConstant,
// archiAssetTypeId: this.archiAssetTypeId,
}
deleteMoreZiChanJiaGouTable(params).then(res => {
if(res.code == 200) {
this.get_table();
Message({
type: 'success',
message: '删除成功!'
});
}else{
Message({
type: 'error',
message: res.msg
});
}
});
}).catch(() => {
Message({
type: 'info',
message: '已取消'
});
});
},
select_table_rows(data){//表格的勾选
this.selectTable = data;
},
set_table_height() {//动态设置表格高度
const right_container_height = $(".right_container").height();
this.tableHeight = right_container_height - 260 + 'px';
},
treeClick(data) {//左侧树点击
if(!data.archiBelongId) return;
this.archiBelongId = data.archiBelongId;
this.assetConstant = data.assetConstant;
// this.archiAssetTypeId = data.viewId;
this.getZuJianLeiXingSelect(null);
this.get_table();
},
getTreeData() {//查询左侧树
getArchiViewManage({}).then(res => {
if(res.code == 200) {
this.treeDefaultExpand = [res.data[0].viewId];
this.currentNodekey = res.data[0].viewId;
this.$nextTick(() => {
this.$refs.tree.setCurrentKey(this.currentNodekey);
});
res.data.map(item => {
item.subList = [];
switch(item.viewName){
case '安全架构':
item['assetConstant'] = 'ARCHI_SAFE';
item['archiBelongId'] = 5;
break;
case '技术架构':
item['assetConstant'] = 'ARCHI_TECHNOLOGY';
item['archiBelongId'] = 4;
break;
case '数据架构':
item['assetConstant'] = 'ARCHI_DATA';
item['archiBelongId'] = 3;
break;
case '应用架构':
item['assetConstant'] = 'ARCHI_APPLICATION';
item['archiBelongId'] = 2;
break;
case '业务架构':
item['assetConstant'] = 'ARCHI_BUSINESS';
item['archiBelongId'] = 1;
break;
}
});
// res.data.map(item => {
// switch(item.viewName){
// case '安全架构':
// item.subList.map(item2 => {
// item2['assetConstant'] = 'ARCHI_SAFE';
// item2['archiBelongId'] = 5;
// })
// break;
// case '技术架构':
// item.subList.map(item2 => {
// item2['assetConstant'] = 'ARCHI_TECHNOLOGY';
// item2['archiBelongId'] = 4;
// })
// break;
// case '数据架构':
// item.subList.map(item2 => {
// item2['assetConstant'] = 'ARCHI_DATA';
// item2['archiBelongId'] = 3;
// })
// break;
// case '应用架构':
// item.subList.map(item2 => {
// item2['assetConstant'] = 'ARCHI_APPLICATION';
// item2['archiBelongId'] = 2;
// })
// break;
// case '业务架构':
// item.subList.map(item2 => {
// item2['assetConstant'] = 'ARCHI_BUSINESS';
// item2['archiBelongId'] = 1;
// })
// break;
// }
// });
this.treeData[0].subList = res.data;
this.archiBelongId = res.data[0].archiBelongId;
this.assetConstant = res.data[0].assetConstant;
// this.archiAssetTypeId = res.data[0].viewId;
this.getShangJiJieDianSelect();
this.getZuJianLeiXingSelect(null);
this.getGuanLianZiChanSelectData(null);
this.get_table();
}else {
Message({
type: 'error',
message: res.msg
});
}
});
},
}
}
</script>
......@@ -956,46 +61,33 @@
.el-message-box__content{
padding: 60px 15px 60px 15px;
}
.el-select-dropdown__item{
height: auto;
}
.el-select-dropdown__item.hover, .el-select-dropdown__item:hover{
background-color: #fff !important;
}
</style>
<style scoped>
.filter-tree{
width: 300px;
.el-tabs{
width: 100%;
height: 100%;
overflow-y: auto;
}
.dynamicFormClass{
width: 100% !important;
}
/deep/ .el-tree-node__expand-icon {
column-count: #01b7c9;
/deep/ .el-tabs__item.is-active {
color: #0D867F;
}
/deep/ .el-tree-node__expand-icon.is-leaf {
color: transparent !important;
/deep/ .el-tabs__item:hover{
color: #0D867F;
}
/deep/ .dynamicFormClass .el-form-item__content {
width: calc(100% - 210px) !important;
text-align: left;
/deep/ .el-tabs__active-bar{
background-color: #0D867F;
}
.el-form-item{
display: flex;
width: 33%;
/deep/ .el-tabs__content{
height: calc(100% - 38px);
padding: 0;
}
/deep/ .el-form-item__label{
width: 160px;
.el-tab-pane{
height: 100%;
}
.form_item_container{
.currentAssetsList{
width: 100%;
height: 100%;
display: flex;
flex-wrap: wrap;
}
.greenButton{
background-color: #0D867F;
color: #fff;
position: relative;
}
/deep/ .el-dialog__header{
background-color: #0D867F;
......@@ -1007,128 +99,8 @@
/deep/ .el-dialog__close {
color: #fff;
}
.el-pagination{
margin-top: 30px;
}
/deep/ .el-pagination.is-background .el-pager li:not(.disabled).active{
background-color: #0D867F;
}
.shanChu_btn{
color: #DD6A15;
background-color: #F8EBE2;
}
.table_container{
width: 97%;
height: calc(100% - 40px);
margin-top: 20px;
}
/deep/ .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content{
.greenButton{
background-color: #0D867F;
color: #fff;
}
/deep/ .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content >.is-leaf{
background-color: #0D867F !important;
}
/deep/ .is-leaf {
background-color: #fff !important;
}
.busiAssetslist{
width: 100%;
/* height: calc(100% - 20px); */
height: 100%;
display: flex;
/* padding-right: 20px;
padding-left: 20px;
padding-bottom: 20px; */
}
.left_container{
width: 20%;
margin-right: 20px;
}
.right_container{
width: 80%;
}
.search_menu{
margin-top: 20px;
margin-right: 20px;
display: flex;
justify-content: space-between;
}
.search_menu_item_container{
display: flex;
align-items: center;
}
.search_menu_btn_container{
display: flex;
align-items: center;
}
.search_menu_item{
display: flex;
align-items: center;
width: 344px;
}
.search_title{
/* width: 20%; */
flex-shrink: 0;
margin-right: 15px;
}
.search_item{
width: 60%;
}
.search_btn{
width: 100%;
display: flex;
margin-top: 50px;
margin-bottom: 20px;
}
.import_btn{
display: flex;
align-items: center;
justify-content: center;
width: 86px;
height: 36px;
margin: 0 10px;
background: rgba(13,134,127,0.1);
border-radius: 6px 6px 6px 6px;
font-size: 14px;
color: #0D867F;
cursor: pointer;
}
.btn_icon{
margin-right: 10px;
}
.query_btn{
display: flex;
align-items: center;
justify-content: center;
width: 76px;
height: 32px;
background: rgba(13,134,127,1);
border-radius: 6px 6px 6px 6px;
border: 1px solid #0D867F;
font-size: 14px;
color: #fff;
margin-right: 10px;
cursor: pointer;
}
.reset_btn{
display: flex;
align-items: center;
justify-content: center;
width: 76px;
height: 32px;
background: rgba(244,244,244,1);
border-radius: 6px 6px 6px 6px;
border: 1px solid #ccc;
font-size: 14px;
color: #666;
cursor: pointer;
}
.el-button--primary{
background: rgba(13,134,127,0.1);
color: #0D867F;
border: 0;
}
</style>
\ No newline at end of file
</style>
<template>
<div class="tab1">
<div class="table_container">
<div class="search_btn">
<div class="version_btn">
<img class="btn_icon" src="@/assets/archi-ele-list/version.png" alt="" />
<p>发布</p>
</div>
<div class="cancel_version_btn">
<img class="btn_icon" src="@/assets/archi-ele-list/version.png" alt="" />
<p>取消发布</p>
</div>
</div>
<el-table :height="tableHeight" v-loading="loading" :data="tableData" stripe border>
<el-table-column type="index" label="序号" width="80" align="center"></el-table-column>
<el-table-column prop="deptName" label="业务域" align="center"></el-table-column>
<el-table-column prop="startTime" label="一级业务职能" align="center"></el-table-column>
<el-table-column prop="policyName" label="二级业务职能" align="center"></el-table-column>
<el-table-column prop="policyContent" 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="viewItem(scope.row)">查看</el-button>
<el-button icon="el-icon-upload2" type="primary" size="mini" @click="cancelReleaseItem(scope.row)" v-if="scope.row.state == 1">取消发布</el-button>
<el-button icon="el-icon-upload2" type="primary" size="mini" @click="releaseItem(scope.row)" v-if="scope.row.state != 1">发布</el-button>
</div>
</template>
</el-table-column>
</el-table>
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pager.current"
:page-sizes="pager.sizes"
:page-size="pager.size"
layout="total, sizes, prev, pager, next, jumper"
:total="pager.total">
</el-pagination>
</div>
</div>
</template>
<script>
import {
getJiShuZhengCeGuanLianShiYongTable,
getDianXingAnLiSelectData
} from '@/api/index.js';
import { MessageBox, Message } from 'element-ui';
import $ from 'jquery';
export default {
name: 'tab1',
components: {
},
data() {
return {
is_add_edit: 'add',
tableData: [],
loading: false,
search_select1: [],
pager: {
current: 1,
sizes: [10, 20, 50, 100, 200],
size: 10,
total: 20 //总条数
},
tableHeight: null,
searchParams: {
policyName: null,
conformCount: null,
},
fuHeDu: [],
};
},
mounted(){
window.addEventListener('resize', () => {
this.set_table_height();
})
this.set_table_height();
this.get_table();
this.get_fu_he_du_select().then(res => {
this.fuHeDu = res;
})
},
methods: {
viewItem(data) {
},
releaseItem(data) {
},
cancelReleaseItem(data) {
},
get_fu_he_du_select() {//符合度下拉
const params = {
key: "tech_compliance"
}
return new Promise((resolve, reject) => {
getDianXingAnLiSelectData(params).then(res => {
if(res.code == 200) {
resolve(res.data);
}
})
})
},
set_table_height() {//动态设置表格高度
const table_container_height = $(".table_container").height();
const search_btn_height = $(".search_btn").outerHeight(true);
this.tableHeight = table_container_height - search_btn_height - 90 + 'px';
},
search_table() {//搜索
this.pager.current = 1;
this.get_table();
},
reset() {//重置
this.searchParams.policyName = null;
this.searchParams.conformCount = null;
},
// 每页条数改变
handleSizeChange(val) {
this.pager.current = 1;
this.pager.size = val;
this.get_table();
},
//当前页码改变
handleCurrentChange(val) {
this.pager.current = val;
this.get_table();
},
get_table() {//查询表格数据
this.loading = true;
const params = {
"current": this.pager.current,
"pageSize": this.pager.size,
};
getJiShuZhengCeGuanLianShiYongTable(params).then(res => {
this.loading = false;
console.log(res)
// this.tableData = res.records;
// this.pager.current = res.current;
// this.pager.total = res.total;
// this.pager.size = res.size;
});
},
}
}
</script>
<style>
.confirmClass{
background-color: #0D867F !important;
}
.el-message-box__content{
padding: 60px 15px 60px 15px;
}
</style>
<style scoped>
.version_btn{
display: flex;
align-items: center;
justify-content: center;
width: 84px;
height: 32px;
background: rgba(13,134,127,0.1);
border-radius: 6px 6px 6px 6px;
/* border: 1px solid #0D867F; */
font-size: 14px;
color: #0D867F;
cursor: pointer;
margin-left: 15px;
}
.cancel_version_btn{
display: flex;
align-items: center;
justify-content: center;
width: 104px;
height: 32px;
background: rgba(13,134,127,0.1);
border-radius: 6px 6px 6px 6px;
/* border: 1px solid #0D867F; */
font-size: 14px;
color: #0D867F;
cursor: pointer;
margin-left: 15px;
}
.tab1{
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
}
.search_btn{
width: 100%;
display: flex;
margin-bottom: 20px;
}
.el-button--primary{
background: rgba(13,134,127,0.1);
color: #0D867F;
border: 0;
}
/deep/ .el-input-group__append{
background-color: #0D867F;
color: #fff;
cursor: pointer;
}
.table_container{
width: 97%;
height: calc(100% - 40px);
margin-top: 20px;
}
.el-pagination{
margin-top: 30px;
}
/deep/ .el-pagination.is-background .el-pager li:not(.disabled).active{
background-color: #0D867F;
}
.greenButton{
background-color: #0D867F;
color: #fff;
}
.el-form-item{
display: flex;
align-items: center;
width: 33%;
}
</style>
\ No newline at end of file
<template>
<div class="tab2">
<div class="table_container">
<div class="search_btn">
<div class="version_btn">
<img class="btn_icon" src="@/assets/archi-ele-list/version.png" alt="" />
<p>发布</p>
</div>
<div class="cancel_version_btn">
<img class="btn_icon" src="@/assets/archi-ele-list/version.png" alt="" />
<p>取消发布</p>
</div>
</div>
<el-table :height="tableHeight" v-loading="loading" :data="tableData" stripe border>
<el-table-column type="index" label="序号" width="80" align="center"></el-table-column>
<el-table-column prop="deptName" label="业务域" align="center"></el-table-column>
<el-table-column prop="startTime" label="一级功能" align="center"></el-table-column>
<el-table-column prop="policyName" label="二级功能" align="center"></el-table-column>
<el-table-column prop="policyContent" 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="viewItem(scope.row)">查看</el-button>
<el-button icon="el-icon-upload2" type="primary" size="mini" @click="cancelReleaseItem(scope.row)" v-if="scope.row.state == 1">取消发布</el-button>
<el-button icon="el-icon-upload2" type="primary" size="mini" @click="releaseItem(scope.row)" v-if="scope.row.state != 1">发布</el-button>
</div>
</template>
</el-table-column>
</el-table>
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pager.current"
:page-sizes="pager.sizes"
:page-size="pager.size"
layout="total, sizes, prev, pager, next, jumper"
:total="pager.total">
</el-pagination>
</div>
</div>
</template>
<script>
import {
getJiShuZhengCeGuanLianShiYongTable,
getDianXingAnLiSelectData
} from '@/api/index.js';
import { MessageBox, Message } from 'element-ui';
import $ from 'jquery';
export default {
name: 'tab2',
components: {
},
data() {
return {
is_add_edit: 'add',
tableData: [],
loading: false,
search_select1: [],
pager: {
current: 1,
sizes: [10, 20, 50, 100, 200],
size: 10,
total: 20 //总条数
},
tableHeight: null,
searchParams: {
policyName: null,
conformCount: null,
},
fuHeDu: [],
};
},
mounted(){
window.addEventListener('resize', () => {
this.set_table_height();
})
this.set_table_height();
this.get_table();
this.get_fu_he_du_select().then(res => {
this.fuHeDu = res;
})
},
methods: {
viewItem(data) {
},
releaseItem(data) {
},
cancelReleaseItem(data) {
},
get_fu_he_du_select() {//符合度下拉
const params = {
key: "tech_compliance"
}
return new Promise((resolve, reject) => {
getDianXingAnLiSelectData(params).then(res => {
if(res.code == 200) {
resolve(res.data);
}
})
})
},
set_table_height() {//动态设置表格高度
const table_container_height = $(".table_container").height();
const search_btn_height = $(".search_btn").outerHeight(true);
this.tableHeight = table_container_height - search_btn_height - 90 + 'px';
},
search_table() {//搜索
this.pager.current = 1;
this.get_table();
},
reset() {//重置
this.searchParams.policyName = null;
this.searchParams.conformCount = null;
},
// 每页条数改变
handleSizeChange(val) {
this.pager.current = 1;
this.pager.size = val;
this.get_table();
},
//当前页码改变
handleCurrentChange(val) {
this.pager.current = val;
this.get_table();
},
get_table() {//查询表格数据
this.loading = true;
const params = {
"current": this.pager.current,
"pageSize": this.pager.size,
};
getJiShuZhengCeGuanLianShiYongTable(params).then(res => {
this.loading = false;
console.log(res)
// this.tableData = res.records;
// this.pager.current = res.current;
// this.pager.total = res.total;
// this.pager.size = res.size;
});
},
}
}
</script>
<style>
.confirmClass{
background-color: #0D867F !important;
}
.el-message-box__content{
padding: 60px 15px 60px 15px;
}
</style>
<style scoped>
.version_btn{
display: flex;
align-items: center;
justify-content: center;
width: 84px;
height: 32px;
background: rgba(13,134,127,0.1);
border-radius: 6px 6px 6px 6px;
/* border: 1px solid #0D867F; */
font-size: 14px;
color: #0D867F;
cursor: pointer;
margin-left: 15px;
}
.cancel_version_btn{
display: flex;
align-items: center;
justify-content: center;
width: 104px;
height: 32px;
background: rgba(13,134,127,0.1);
border-radius: 6px 6px 6px 6px;
/* border: 1px solid #0D867F; */
font-size: 14px;
color: #0D867F;
cursor: pointer;
margin-left: 15px;
}
.tab2{
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
}
.search_btn{
width: 100%;
display: flex;
margin-bottom: 20px;
}
.el-button--primary{
background: rgba(13,134,127,0.1);
color: #0D867F;
border: 0;
}
/deep/ .el-input-group__append{
background-color: #0D867F;
color: #fff;
cursor: pointer;
}
.table_container{
width: 97%;
height: calc(100% - 40px);
margin-top: 20px;
}
.el-pagination{
margin-top: 30px;
}
/deep/ .el-pagination.is-background .el-pager li:not(.disabled).active{
background-color: #0D867F;
}
.greenButton{
background-color: #0D867F;
color: #fff;
}
.el-form-item{
display: flex;
align-items: center;
width: 33%;
}
</style>
\ No newline at end of file
<template>
<div class="tab3">
<div class="table_container">
<div class="search_btn">
<div class="version_btn">
<img class="btn_icon" src="@/assets/archi-ele-list/version.png" alt="" />
<p>发布</p>
</div>
<div class="cancel_version_btn">
<img class="btn_icon" src="@/assets/archi-ele-list/version.png" alt="" />
<p>取消发布</p>
</div>
</div>
<el-table :height="tableHeight" v-loading="loading" :data="tableData" stripe border>
<el-table-column type="index" label="序号" width="80" align="center"></el-table-column>
<el-table-column prop="deptName" label="业务域" align="center"></el-table-column>
<el-table-column prop="startTime" label="一级功能" align="center"></el-table-column>
<el-table-column prop="policyName" label="二级功能" align="center"></el-table-column>
<el-table-column prop="policyContent" label="三级功能" align="center"></el-table-column>
<el-table-column prop="policyContent" 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="viewItem(scope.row)">查看</el-button>
<el-button icon="el-icon-upload2" type="primary" size="mini" @click="cancelReleaseItem(scope.row)" v-if="scope.row.state == 1">取消发布</el-button>
<el-button icon="el-icon-upload2" type="primary" size="mini" @click="releaseItem(scope.row)" v-if="scope.row.state != 1">发布</el-button>
</div>
</template>
</el-table-column>
</el-table>
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pager.current"
:page-sizes="pager.sizes"
:page-size="pager.size"
layout="total, sizes, prev, pager, next, jumper"
:total="pager.total">
</el-pagination>
</div>
</div>
</template>
<script>
import {
getJiShuZhengCeGuanLianShiYongTable,
getDianXingAnLiSelectData
} from '@/api/index.js';
import { MessageBox, Message } from 'element-ui';
import $ from 'jquery';
export default {
name: 'tab3',
components: {
},
data() {
return {
is_add_edit: 'add',
tableData: [],
loading: false,
search_select1: [],
pager: {
current: 1,
sizes: [10, 20, 50, 100, 200],
size: 10,
total: 20 //总条数
},
tableHeight: null,
searchParams: {
policyName: null,
conformCount: null,
},
fuHeDu: [],
};
},
mounted(){
window.addEventListener('resize', () => {
this.set_table_height();
})
this.set_table_height();
this.get_table();
this.get_fu_he_du_select().then(res => {
this.fuHeDu = res;
})
},
methods: {
viewItem(data) {
},
releaseItem(data) {
},
cancelReleaseItem(data) {
},
get_fu_he_du_select() {//符合度下拉
const params = {
key: "tech_compliance"
}
return new Promise((resolve, reject) => {
getDianXingAnLiSelectData(params).then(res => {
if(res.code == 200) {
resolve(res.data);
}
})
})
},
set_table_height() {//动态设置表格高度
const table_container_height = $(".table_container").height();
const search_btn_height = $(".search_btn").outerHeight(true);
this.tableHeight = table_container_height - search_btn_height - 90 + 'px';
},
search_table() {//搜索
this.pager.current = 1;
this.get_table();
},
reset() {//重置
this.searchParams.policyName = null;
this.searchParams.conformCount = null;
},
// 每页条数改变
handleSizeChange(val) {
this.pager.current = 1;
this.pager.size = val;
this.get_table();
},
//当前页码改变
handleCurrentChange(val) {
this.pager.current = val;
this.get_table();
},
get_table() {//查询表格数据
this.loading = true;
const params = {
"current": this.pager.current,
"pageSize": this.pager.size,
};
getJiShuZhengCeGuanLianShiYongTable(params).then(res => {
this.loading = false;
console.log(res)
// this.tableData = res.records;
// this.pager.current = res.current;
// this.pager.total = res.total;
// this.pager.size = res.size;
});
},
}
}
</script>
<style>
.confirmClass{
background-color: #0D867F !important;
}
.el-message-box__content{
padding: 60px 15px 60px 15px;
}
</style>
<style scoped>
.version_btn{
display: flex;
align-items: center;
justify-content: center;
width: 84px;
height: 32px;
background: rgba(13,134,127,0.1);
border-radius: 6px 6px 6px 6px;
/* border: 1px solid #0D867F; */
font-size: 14px;
color: #0D867F;
cursor: pointer;
margin-left: 15px;
}
.cancel_version_btn{
display: flex;
align-items: center;
justify-content: center;
width: 104px;
height: 32px;
background: rgba(13,134,127,0.1);
border-radius: 6px 6px 6px 6px;
/* border: 1px solid #0D867F; */
font-size: 14px;
color: #0D867F;
cursor: pointer;
margin-left: 15px;
}
.tab3{
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
}
.search_btn{
width: 100%;
display: flex;
margin-bottom: 20px;
}
.el-button--primary{
background: rgba(13,134,127,0.1);
color: #0D867F;
border: 0;
}
/deep/ .el-input-group__append{
background-color: #0D867F;
color: #fff;
cursor: pointer;
}
.table_container{
width: 97%;
height: calc(100% - 40px);
margin-top: 20px;
}
.el-pagination{
margin-top: 30px;
}
/deep/ .el-pagination.is-background .el-pager li:not(.disabled).active{
background-color: #0D867F;
}
.greenButton{
background-color: #0D867F;
color: #fff;
}
.el-form-item{
display: flex;
align-items: center;
width: 33%;
}
</style>
\ No newline at end of file
<template>
<div class="tab4">
<div class="table_container">
<div class="search_btn">
<div class="version_btn">
<img class="btn_icon" src="@/assets/archi-ele-list/version.png" alt="" />
<p>发布</p>
</div>
<div class="cancel_version_btn">
<img class="btn_icon" src="@/assets/archi-ele-list/version.png" alt="" />
<p>取消发布</p>
</div>
</div>
<el-table :height="tableHeight" v-loading="loading" :data="tableData" stripe border>
<el-table-column type="index" label="序号" width="80" align="center"></el-table-column>
<el-table-column prop="deptName" label="资产类型" align="center"></el-table-column>
<el-table-column prop="startTime" 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="viewItem(scope.row)">查看</el-button>
<el-button icon="el-icon-upload2" type="primary" size="mini" @click="cancelReleaseItem(scope.row)" v-if="scope.row.state == 1">取消发布</el-button>
<el-button icon="el-icon-upload2" type="primary" size="mini" @click="releaseItem(scope.row)" v-if="scope.row.state != 1">发布</el-button>
</div>
</template>
</el-table-column>
</el-table>
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pager.current"
:page-sizes="pager.sizes"
:page-size="pager.size"
layout="total, sizes, prev, pager, next, jumper"
:total="pager.total">
</el-pagination>
</div>
</div>
</template>
<script>
import {
getJiShuZhengCeGuanLianShiYongTable,
getDianXingAnLiSelectData
} from '@/api/index.js';
import { MessageBox, Message } from 'element-ui';
import $ from 'jquery';
export default {
name: 'tab4',
components: {
},
data() {
return {
is_add_edit: 'add',
tableData: [],
loading: false,
search_select1: [],
pager: {
current: 1,
sizes: [10, 20, 50, 100, 200],
size: 10,
total: 20 //总条数
},
tableHeight: null,
searchParams: {
policyName: null,
conformCount: null,
},
fuHeDu: [],
};
},
mounted(){
window.addEventListener('resize', () => {
this.set_table_height();
})
this.set_table_height();
this.get_table();
this.get_fu_he_du_select().then(res => {
this.fuHeDu = res;
})
},
methods: {
viewItem(data) {
},
releaseItem(data) {
},
cancelReleaseItem(data) {
},
get_fu_he_du_select() {//符合度下拉
const params = {
key: "tech_compliance"
}
return new Promise((resolve, reject) => {
getDianXingAnLiSelectData(params).then(res => {
if(res.code == 200) {
resolve(res.data);
}
})
})
},
set_table_height() {//动态设置表格高度
const table_container_height = $(".table_container").height();
const search_btn_height = $(".search_btn").outerHeight(true);
this.tableHeight = table_container_height - search_btn_height - 90 + 'px';
},
search_table() {//搜索
this.pager.current = 1;
this.get_table();
},
reset() {//重置
this.searchParams.policyName = null;
this.searchParams.conformCount = null;
},
// 每页条数改变
handleSizeChange(val) {
this.pager.current = 1;
this.pager.size = val;
this.get_table();
},
//当前页码改变
handleCurrentChange(val) {
this.pager.current = val;
this.get_table();
},
get_table() {//查询表格数据
this.loading = true;
const params = {
"current": this.pager.current,
"pageSize": this.pager.size,
};
getJiShuZhengCeGuanLianShiYongTable(params).then(res => {
this.loading = false;
console.log(res)
// this.tableData = res.records;
// this.pager.current = res.current;
// this.pager.total = res.total;
// this.pager.size = res.size;
});
},
}
}
</script>
<style>
.confirmClass{
background-color: #0D867F !important;
}
.el-message-box__content{
padding: 60px 15px 60px 15px;
}
</style>
<style scoped>
.version_btn{
display: flex;
align-items: center;
justify-content: center;
width: 84px;
height: 32px;
background: rgba(13,134,127,0.1);
border-radius: 6px 6px 6px 6px;
/* border: 1px solid #0D867F; */
font-size: 14px;
color: #0D867F;
cursor: pointer;
margin-left: 15px;
}
.cancel_version_btn{
display: flex;
align-items: center;
justify-content: center;
width: 104px;
height: 32px;
background: rgba(13,134,127,0.1);
border-radius: 6px 6px 6px 6px;
/* border: 1px solid #0D867F; */
font-size: 14px;
color: #0D867F;
cursor: pointer;
margin-left: 15px;
}
.tab4{
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
}
.search_btn{
width: 100%;
display: flex;
margin-bottom: 20px;
}
.el-button--primary{
background: rgba(13,134,127,0.1);
color: #0D867F;
border: 0;
}
/deep/ .el-input-group__append{
background-color: #0D867F;
color: #fff;
cursor: pointer;
}
.table_container{
width: 97%;
height: calc(100% - 40px);
margin-top: 20px;
}
.el-pagination{
margin-top: 30px;
}
/deep/ .el-pagination.is-background .el-pager li:not(.disabled).active{
background-color: #0D867F;
}
.greenButton{
background-color: #0D867F;
color: #fff;
}
.el-form-item{
display: flex;
align-items: center;
width: 33%;
}
</style>
\ No newline at end of file
<template>
<div class="tab5">
<div class="table_container">
<div class="search_btn">
<div class="version_btn">
<img class="btn_icon" src="@/assets/archi-ele-list/version.png" alt="" />
<p>发布</p>
</div>
<div class="cancel_version_btn">
<img class="btn_icon" src="@/assets/archi-ele-list/version.png" alt="" />
<p>取消发布</p>
</div>
</div>
<el-table :height="tableHeight" v-loading="loading" :data="tableData" stripe border>
<el-table-column type="index" label="序号" width="80" align="center"></el-table-column>
<el-table-column prop="deptName" label="安全架构分类" align="center"></el-table-column>
<el-table-column prop="startTime" 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="viewItem(scope.row)">查看</el-button>
<el-button icon="el-icon-upload2" type="primary" size="mini" @click="cancelReleaseItem(scope.row)" v-if="scope.row.state == 1">取消发布</el-button>
<el-button icon="el-icon-upload2" type="primary" size="mini" @click="releaseItem(scope.row)" v-if="scope.row.state != 1">发布</el-button>
</div>
</template>
</el-table-column>
</el-table>
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pager.current"
:page-sizes="pager.sizes"
:page-size="pager.size"
layout="total, sizes, prev, pager, next, jumper"
:total="pager.total">
</el-pagination>
</div>
</div>
</template>
<script>
import {
getJiShuZhengCeGuanLianShiYongTable,
getDianXingAnLiSelectData
} from '@/api/index.js';
import { MessageBox, Message } from 'element-ui';
import $ from 'jquery';
export default {
name: 'tab5',
components: {
},
data() {
return {
is_add_edit: 'add',
tableData: [],
loading: false,
search_select1: [],
pager: {
current: 1,
sizes: [10, 20, 50, 100, 200],
size: 10,
total: 20 //总条数
},
tableHeight: null,
searchParams: {
policyName: null,
conformCount: null,
},
fuHeDu: [],
};
},
mounted(){
window.addEventListener('resize', () => {
this.set_table_height();
})
this.set_table_height();
this.get_table();
this.get_fu_he_du_select().then(res => {
this.fuHeDu = res;
})
},
methods: {
viewItem(data) {
},
releaseItem(data) {
},
cancelReleaseItem(data) {
},
get_fu_he_du_select() {//符合度下拉
const params = {
key: "tech_compliance"
}
return new Promise((resolve, reject) => {
getDianXingAnLiSelectData(params).then(res => {
if(res.code == 200) {
resolve(res.data);
}
})
})
},
set_table_height() {//动态设置表格高度
const table_container_height = $(".table_container").height();
const search_btn_height = $(".search_btn").outerHeight(true);
this.tableHeight = table_container_height - search_btn_height - 90 + 'px';
},
search_table() {//搜索
this.pager.current = 1;
this.get_table();
},
reset() {//重置
this.searchParams.policyName = null;
this.searchParams.conformCount = null;
},
// 每页条数改变
handleSizeChange(val) {
this.pager.current = 1;
this.pager.size = val;
this.get_table();
},
//当前页码改变
handleCurrentChange(val) {
this.pager.current = val;
this.get_table();
},
get_table() {//查询表格数据
this.loading = true;
const params = {
"current": this.pager.current,
"pageSize": this.pager.size,
};
getJiShuZhengCeGuanLianShiYongTable(params).then(res => {
this.loading = false;
console.log(res)
// this.tableData = res.records;
// this.pager.current = res.current;
// this.pager.total = res.total;
// this.pager.size = res.size;
});
},
}
}
</script>
<style>
.confirmClass{
background-color: #0D867F !important;
}
.el-message-box__content{
padding: 60px 15px 60px 15px;
}
</style>
<style scoped>
.version_btn{
display: flex;
align-items: center;
justify-content: center;
width: 84px;
height: 32px;
background: rgba(13,134,127,0.1);
border-radius: 6px 6px 6px 6px;
/* border: 1px solid #0D867F; */
font-size: 14px;
color: #0D867F;
cursor: pointer;
margin-left: 15px;
}
.cancel_version_btn{
display: flex;
align-items: center;
justify-content: center;
width: 104px;
height: 32px;
background: rgba(13,134,127,0.1);
border-radius: 6px 6px 6px 6px;
/* border: 1px solid #0D867F; */
font-size: 14px;
color: #0D867F;
cursor: pointer;
margin-left: 15px;
}
.tab5{
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
}
.search_btn{
width: 100%;
display: flex;
margin-bottom: 20px;
}
.el-button--primary{
background: rgba(13,134,127,0.1);
color: #0D867F;
border: 0;
}
/deep/ .el-input-group__append{
background-color: #0D867F;
color: #fff;
cursor: pointer;
}
.table_container{
width: 97%;
height: calc(100% - 40px);
margin-top: 20px;
}
.el-pagination{
margin-top: 30px;
}
/deep/ .el-pagination.is-background .el-pager li:not(.disabled).active{
background-color: #0D867F;
}
.greenButton{
background-color: #0D867F;
color: #fff;
}
.el-form-item{
display: flex;
align-items: center;
width: 33%;
}
</style>
\ No newline at end of file
......@@ -45,15 +45,15 @@
<el-table-column prop="appName" label="系统名称" align="center" width="200" :show-overflow-tooltip="true"></el-table-column>
<el-table-column label="建设类型" align="center">
<template slot-scope="scope">
<span v-if="scope.row.buildType == 1">新建</span>
<span v-else></span>
<span v-if="scope.row.buildType == 1">统推</span>
<span v-else-if="scope.row.buildType == 2"></span>
</template>
</el-table-column>
<el-table-column prop="prjName" 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">
<span v-if="scope.row.prjPlanClass == 1"></span>
<span v-else></span>
<span v-if="scope.row.prjPlanClass == 1">新建</span>
<span v-else-if="scope.row.prjPlanClass == 2">续建</span>
</template>
</el-table-column>
<el-table-column prop="buildOrg" label="承建单位" align="center"></el-table-column>
......@@ -406,6 +406,7 @@ export default {
{ id: 3, tableLet1: '需求规格说明书', fileList: [], fileArray: [] },
{ id: 4, tableLet1: '概要设计说明书', fileList: [], fileArray: [] },
{ id: 5, tableLet1: '安全防护方案', fileList: [], fileArray: [] },
{ id: 5, tableLet1: '其他', fileList: [], fileArray: [] },
],
prjId: null,
};
......
......@@ -422,7 +422,8 @@ export default {
state: 1,
archiBelongId: this.graphGroup,
assetConstant: this.assetConstant,
archiViewId: this.viewId
archiViewId: this.viewId,
prjId: this.showSelectTitle.prjId
}
queryArchiGraph(params).then(res => {
if(res.code == 200) {
......
......@@ -415,7 +415,8 @@ export default {
state: 1,
archiBelongId: this.graphGroup,
assetConstant: this.assetConstant,
archiViewId: this.viewId
archiViewId: this.viewId,
appId: this.showSelectTitle.appId
}
queryArchiGraph(params).then(res => {
if(res.code == 200) {
......
......@@ -34,8 +34,8 @@
</div>
</div>
<div class="search_btn">
<el-button type="primary" size="medium" icon="el-icon-document-add" @click="operation('add', 1)">新建统推系统</el-button>
<el-button type="primary" size="medium" icon="el-icon-document-add" @click="operation('add', 2)">新建自建系统</el-button>
<el-button type="primary" size="medium" icon="el-icon-document-add" @click="operation('add', null)">新建系统</el-button>
<!-- <el-button type="primary" size="medium" icon="el-icon-document-add" @click="operation('add', 2)">新建自建系统</el-button> -->
<!-- <el-button type="primary" size="medium" icon="el-icon-delete">删除</el-button> -->
</div>
<el-table :height="tableHeight" v-loading="loading" :data="tableData" stripe border>
......@@ -46,7 +46,7 @@
<el-table-column label="建设类型" align="center">
<template slot-scope="scope">
<span v-if="scope.row.buildType == 1">统推</span>
<span v-else>自建</span>
<span v-else-if="scope.row.buildType == 2">自建</span>
</template>
</el-table-column>
<el-table-column prop="buildOrg" label="承建单位" align="center"></el-table-column>
......@@ -94,11 +94,12 @@
<el-form-item label="系统名称:" prop="let3">
<el-input v-no-backslash v-model="ruleForm.let3" maxlength="100"></el-input>
</el-form-item>
<!-- <el-form-item label="建设类型:" prop="let4">
<el-select clearable placeholder="请选择" v-model="ruleForm.let4">
<el-option v-for="item in jianSheLeiXingSelect" :key="item.value" :label="item.label" :value="item.value"></el-option>
<el-form-item label="系统类型:" prop="let4">
<el-select clearable v-model="ruleForm.let4">
<el-option label="统推" :value="1"></el-option>
<el-option label="自建" :value="2"></el-option>
</el-select>
</el-form-item> -->
</el-form-item>
<el-form-item label="承建单位:" prop="let5">
<el-input v-no-backslash v-model="ruleForm.let5" maxlength="100"></el-input>
</el-form-item>
......@@ -135,7 +136,7 @@ export default {
let1: null,
let2: null,
let3: null,
// let4: null,
let4: null,
let5: null,
let6: null,
},
......@@ -149,9 +150,9 @@ export default {
let3: [
{ required: true, message: '请输入系统名称', trigger: 'blur' },
],
// let4: [
// { required: true, message: '请选择建设类型', trigger: 'change' },
// ],
let4: [
{ required: true, message: '请选择系统类型', trigger: 'change' },
],
},
add_dialog: false,
dialogTitle: null,
......@@ -190,7 +191,7 @@ export default {
switch(type){
case 'add':
this.openAddDialog();
this.dialogTitle = data == 1 ? '新建统推系统' : '新建自建系统';
this.dialogTitle = '新建系统';
break;
case 'edit':
this.editItem(data);
......@@ -208,7 +209,7 @@ export default {
},
editItem(row) {//编辑
this.add_dialog = true;
this.dialogTitle = row.buildType == 1 ? '编辑统推系统' : '编辑自建系统';
this.dialogTitle = '编辑系统';
this.ruleForm.let1 = row.manageOrgId;
this.ruleForm.let2 = row.manageDeptId;
this.ruleForm.let3 = row.appName;
......@@ -291,83 +292,43 @@ export default {
manageOrgId: this.ruleForm.let1,
manageDeptId: this.ruleForm.let2,
appName: this.ruleForm.let3,
buildType: this.ruleForm.let4,
buildOrg: this.ruleForm.let5,
projectManager: this.ruleForm.let6,
};
let requestParams;
switch(this.dialogTitle){
case '新建统推系统':
requestParams = { ...params, buildType: 1 };
addasystemInfoManageTable(requestParams).then(res => {
if(res.code == 200) {
this.get_table();
this.add_dialog = false;
Message({
type: 'success',
message: '保存成功!'
});
}else {
Message({
type: 'error',
message: res.msg
});
}
});
break;
case '新建自建系统':
requestParams = { ...params, buildType: 2 };
addasystemInfoManageTable(requestParams).then(res => {
if(res.code == 200) {
this.get_table();
this.add_dialog = false;
Message({
type: 'success',
message: '保存成功!'
});
}else {
Message({
type: 'error',
message: res.msg
});
}
});
break;
case '编辑统推系统':
requestParams = { ...params, buildType: 1, appId: this.appId };
editDeleteSystemInfoManageTable(requestParams).then(res => {
if(res.code == 200) {
this.get_table();
this.add_dialog = false;
Message({
type: 'success',
message: '保存成功!'
});
}else {
Message({
type: 'error',
message: res.msg
});
}
});
break;
case '编辑自建系统':
requestParams = { ...params, buildType: 2, appId: this.appId };
editDeleteSystemInfoManageTable(requestParams).then(res => {
if(res.code == 200) {
this.get_table();
this.add_dialog = false;
Message({
type: 'success',
message: '保存成功!'
});
}else {
Message({
type: 'error',
message: res.msg
});
}
});
break;
const requestParams = this.dialogTitle == '新建系统' ? params : { ...params, appId: this.appId };
if(this.dialogTitle == '新建系统') {
addasystemInfoManageTable(requestParams).then(res => {
if(res.code == 200) {
this.get_table();
this.add_dialog = false;
Message({
type: 'success',
message: '保存成功!'
});
}else {
Message({
type: 'error',
message: res.msg
});
}
});
}else {
editDeleteSystemInfoManageTable(requestParams).then(res => {
if(res.code == 200) {
this.get_table();
this.add_dialog = false;
Message({
type: 'success',
message: '保存成功!'
});
}else {
Message({
type: 'error',
message: res.msg
});
}
});
}
}else {
return false;
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!