Skip to content

liangzhen / framework-tools-web

Go to a project
Commit 6adf997b by liuyong
Options

修改菜单

1 parent 0005501f
Inline Side-by-side
Showing with 468 additions and 332 deletions
.env.development 0 → 100644
NODE_ENV = 'development'
VUE_APP_BASE_URL = "http://43.143.211.42:7003"
.env.production 0 → 100644
NODE_ENV = 'development'
VUE_APP_BASE_URL = "http://43.143.211.42:7003"
package.json
......@@ -3,8 +3,8 @@
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build"
"serve": "vue-cli-service serve --mode development",
"build": "vue-cli-service build --mode production"
},
"dependencies": {
"@onlyoffice/document-editor-vue": "^1.3.0",
......
public/drawio/js/diagramly/EditorUi.js
......@@ -2001,7 +2001,6 @@
var data = Graph.xmlDeclaration +'\n' +
this.getFileData(true, null, null, null, ignoreSelection, currentPage,
null, null, null, uncompressed);
this.saveData(filename, format, data, 'text/xml');
}
else if (format == 'html')
......
public/drawio/js/diagramly/Menus.js
......@@ -4695,6 +4695,9 @@
// const decodedData = Base64.decode(encodedData);//base64解密
// console.log(encodedData)
var composedXMLData = Graph.xmlDeclaration +'\n' +editorUi.getFileData(true, null, null, null, true, true, null, null, null, false);
// console.log(composedXMLData)
var graph = editorUi.editor.graph;
......
public/drawio/js/grapheditor/Format.js
......@@ -1554,7 +1554,7 @@ AttributePanel.prototype.init = function()//二次开发，属性面板内容
// console.log('属性面板');
// var ss = this.editorUi.getSelectionState();
console.log(img);
const objectTag = cell.value;
//元素名称--------------------------------------------------------------------------
......
src/api/index.js 0 → 100644
import { get, post } from '@/utils/http';
export function query_jia_gou_yuan_su_guan_xi_table(params) {//架构元素关系表格
return get('/api/ele/', params);
}
// 导入列表
export function offlineQuery(params) {
return post(`/anasz-smart-screen/offlineQuery/`, params);
}
src/router/index.js
......@@ -25,9 +25,9 @@ const routes = [
component: () => import('@/views/JiaGouYuanSuGuanLi/index.vue'),
},
{
path: '/main/JiaGouYuanSuGuanxiGuanLi',//架构元素关系管理
name: 'JiaGouYuanSuGuanxiGuanLi',
component: () => import('@/views/JiaGouYuanSuGuanxiGuanLi/index.vue'),
path: '/main/JiaGouYuanSuGuanXiGuanLi',//架构元素关系管理
name: 'JiaGouYuanSuGuanXiGuanLi',
component: () => import('@/views/JiaGouYuanShuGuanXiGuanLi/index.vue'),
},
{
path: '/main/JiaGouSTPZ',//架构视图配置
......@@ -59,9 +59,9 @@ const routes = [
name: 'YuanMoXingZiDianGuanLi',
component: () => import('@/views/YuanMoXingZiDianGuanLi/index.vue'),
},{
path: '/main/JiaGouYuanShuGuanXiGuanLi',//元模型字典管理
name: 'JiaGouYuanShuGuanXiGuanLi',
component: () => import('@/views/JiaGouYuanShuGuanXiGuanLi/index.vue'),
path: '/main/NewPage',//元模型字典管理
name: 'NewPage',
component: () => import('@/views/NewPage/index.vue'),
}
]
}
......
src/utils/http.js 0 → 100644
import Vue from 'vue';
import axios from 'axios';
import router from '../router/index.js';
import { Message, MessageBox, Loading } from 'element-ui';
axios.defaults.timeout = 300000;
axios.defaults.baseURL = process.env.VUE_APP_BASE_URL;
//http 请求拦截器
axios.interceptors.request.use(config => {
// config.headers.token = JSON.parse(localStorage.getItem('token')).token;
return config;
},
error => {
return Promise.reject(error);
}
);
//响应拦截器即异常处理
axios.interceptors.response.use(response => {
let code = response.data.code;
// if (response.headers.token) {
// var token = res.headers.token
// window.localStorage.setItem('user_token', token)
// }
if (code == 200) {
return response;
} else if(code == 507||code == 502) {
// Vue.prototype.$message.error('登录状态过期或者没有token,请重新登录！');
// sessionStorage.clear()
// router.push({path:'/login'})
}else if(code == 500) {
// Vue.prototype.$message({message:response.data.msg,type:'error', customClass:'messageIndex_'});
// return response
}else{
return response;
}
}, err => {
if (err && err.response) {
console.log('连接到服务器失败');
} else {
console.log('未知错误');
// Message.error('连接到服务器失败')
}
return Promise.resolve(err.response);
});
export function get(url, params = {}) {
return new Promise((resolve, reject) => {
axios.get(url, { params: params }).then(response => {
if(response){
resolve(response);
}
}).catch(err => {
reject(err);
})
})
}
export function post(url, data = {}) {
return new Promise((resolve, reject) => {
axios.post(url, data).then(response => {
if(response){
resolve(response.data);
}
}, err => {
reject(err);
})
})
}
src/views/JiaGouYuanShuGuanXiGuanLi/index.vue
<template>
<div class="JiaGouYuanShuGuanXiGuanLi">
<div class="table_container">
<div class="search_menu">
<div class="search_menu_item_container">
<div class="search_menu_item">
<span class="search_title">元素关系名称</span>
<el-input v-model="query_item3" placeholder="请输入内容" class="search_item"></el-input>
</div>
<div class="search_menu_item">
<span class="search_title">架构归属</span>
<el-select v-model="query_item1" placeholder="请选择" class="search_item">
<el-option label="业务架构" value="业务架构"></el-option>
<el-option label="应用架构" value="应用架构"></el-option>
<el-option label="内容架构" value="内容架构"></el-option>
<el-option label="技术架构" value="技术架构"></el-option>
<el-option label="安全架构" value="安全架构"></el-option>
</el-select>
</div>
<div class="search_menu_item">
<span class="search_title">状态</span>
<el-select v-model="query_item4" placeholder="请选择" class="search_item">
<el-option label="已发布" value="已发布"></el-option>
<el-option label="已停用" value="已停用"></el-option>
<el-option label="暂存" value="暂存"></el-option>
</el-select>
</div>
</div>
<div class="search_menu_btn_container">
<div class="query_btn">
<img class="btn_icon" src="@/assets/查询icon.png" alt="" />
<p>查询</p>
</div>
<div class="reset_btn">
<img class="btn_icon" src="@/assets/重置icon.png" alt="" />
<p>重置</p>
</div>
</div>
</div>
<div class="search_btn">
<div class="add_btn" @click="add_dialog = true">
<img class="btn_icon" src="@/assets/新建icon.png" alt="" />
<p>新建</p>
</div>
<div class="version_btn">
<img class="btn_icon" src="@/assets/版本发布icon.png" alt="" />
<p>版本发布</p>
</div>
</div>
<el-table :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="let1" label="元素名称" align="center"></el-table-column>
<el-table-column prop="let2" label="元素id" align="center"></el-table-column>
<el-table-column prop="let3" label="关联元素名称" align="center"></el-table-column>
<el-table-column prop="let4" label="关联元素id" align="center"></el-table-column>
<el-table-column prop="let4" label="关联关系名称" align="center"></el-table-column>
<el-table-column prop="let4" label="关联关系描述" align="center"></el-table-column>
<el-table-column prop="let4" label="方向" align="center"></el-table-column>
<el-table-column label="操作" align="center">
<el-table-column prop="let1" label="元素关系名称" width="180" align="center"></el-table-column>
<el-table-column prop="let2" label="对象1" width="180" align="center"></el-table-column>
<el-table-column prop="let7" label="对象1" width="180" align="center"></el-table-column>
<el-table-column prop="let3" label="适用范围" width="180" align="center"></el-table-column>
<el-table-column prop="let4" label="关系描述" width="180" align="center"></el-table-column>
<el-table-column label="图标" align="center">
<template>
<el-button type="text" style="color: #0D867F;">预览</el-button>
</template>
</el-table-column>
<el-table-column prop="let5" label="版本" width="180" align="center"></el-table-column>
<el-table-column prop="let6" label="状态" align="center"></el-table-column>
<el-table-column label="操作" width="360" align="center">
<template>
<div style="display: flex;align-items: center;justify-content: center;">
<div class="add_btn" @click="add_dialog = true" style="border: 0;margin-right: 8px;">
<!-- <img class="btn_icon" src="@/assets/编辑_icon_default.png" alt="" /> -->
<img class="btn_icon" src="@/assets/编辑_icon_default.png" alt="" />
<p>编辑</p>
</div>
<!-- <el-button type="text" icon="el-icon-edit" @click="add_dialog = true">编辑</el-button> -->
<div class="reset_btn" style="border: 0;margin-right: 8px;">
<!-- <img class="btn_icon" src="@/assets/停用_icon_default.png" alt="" /> -->
<img class="btn_icon" src="@/assets/停用_icon_default.png" alt="" />
<p>停用</p>
</div>
<div class="add_btn" style="border: 0;margin-right: 8px;">
<!-- <img class="btn_icon" src="@/assets/发布_icon_default.png" alt="" /> -->
<img class="btn_icon" src="@/assets/发布_icon_default.png" alt="" />
<p>发布</p>
</div>
<div class="reset_btn" style="border: 0;">
<!-- <img class="btn_icon" src="@/assets/删除_icon_default.png" alt="" /> -->
<img class="btn_icon" src="@/assets/删除_icon_default.png" alt="" />
<p>删除</p>
</div>
</div>
......@@ -42,20 +94,20 @@
</div>
<el-dialog
title="新建元素"
title="新建元素关系"
:visible.sync="add_dialog"
:center="false"
width="40%">
<div class="add_dialog_content">
<div class="dialog_form_item">
<div class="dialog_form_item_title">元素名称</div>
<div class="dialog_form_item_title">*元素关系名称</div>
<el-input placeholder="请输入内容" class="dialog_form_item_content" v-model="let1"></el-input>
</div>
<div class="dialog_form_item">
<div class="dialog_form_item_title">架构层次</div>
<!-- <div class="dialog_form_item">
<div class="dialog_form_item_title">元素关系描述</div>
<el-input placeholder="请输入内容" class="dialog_form_item_content" v-model="let2"></el-input>
</div>
<div class="dialog_form_item">
</div> -->
<!-- <div class="dialog_form_item">
<div class="dialog_form_item_title">架构归属</div>
<el-select placeholder="请选择" class="search_item" v-model="let3">
<el-option label="业务架构" value="业务架构"></el-option>
......@@ -64,9 +116,9 @@
<el-option label="技术架构" value="技术架构"></el-option>
<el-option label="安全架构" value="安全架构"></el-option>
</el-select>
</div>
</div> -->
<div class="dialog_form_item">
<div class="dialog_form_item_title">描述</div>
<div class="dialog_form_item_title">*元素关系描述</div>
<el-input type="textarea" :rows="2" placeholder="请输入内容" class="dialog_form_item_content" v-model="let4"></el-input>
</div>
</div>
......@@ -89,13 +141,19 @@ export default {
data() {
return {
tableData: [
{ let1: '业务域', let2: '策略层', let3: '业务架构', let4: '业务域的基本描述', let5: '2023.10.31', let6: '已发布' },
{ let1: '业务职能', let2: '策略层', let3: '业务架构', let4: '业务职能的描述', let5: '2023.10.31', let6: '已发布' },
{ let1: '应用交互', let2: '策略层', let3: '应用架构', let4: '应用交互的基本描述', let5: '2023.10.31', let6: '已发布' },
{ let1: '功能', let2: '策略层', let3: '应用架构', let4: '功能的描述', let5: '2023.09.17', let6: '暂存' },
{ let1: '业务域', let2: '策略层', let3: '业务架构', let4: '业务域的基本描述', let5: '2023.08.18', let6: '已停用' },
{ let1: '分解', let2: '业务域', let7: '业务职能', let3: '业务架构', let4: '业务域的基本描述', let5: '2023.10.31', let6: '已发布' },
{ let1: '支撑', let2: '业务域', let7: '业务职能', let3: '业务架构', let4: '业务职能的描述', let5: '2023.10.31', let6: '已发布' },
{ let1: '聚合', let2: '应用域', let7: '应用职能', let3: '应用架构', let4: '应用交互的基本描述', let5: '2023.10.31', let6: '已发布' },
],
add_dialog: false,
query_item1: null,
query_item3: null,
query_item4: null,
let1: '',
let2: '',
let3: '',
let4: '',
};
},
}
......@@ -104,7 +162,100 @@ export default {
.JiaGouYuanShuGuanXiGuanLi{
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
}
.search_menu{
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;
}
.add_btn{
display: flex;
align-items: center;
justify-content: center;
width: 76px;
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;
}
.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;
}
.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 #0D867F;
font-size: 14px;
color: #666;
cursor: pointer;
}
.btn_icon{
margin-right: 10px;
}
.table_container{
width: 97%;
......@@ -113,6 +264,15 @@ export default {
.el-pagination{
margin-top: 50px;
}
.dialog_form_item{
display: flex;
align-items: center;
margin-bottom: 10px;
}
.dialog_form_item_title{
flex-shrink: 0;
margin-right: 15px;
}
/deep/ .el-dialog__header{
text-align: left;
}
......
src/views/JiaGouYuanSuGuanLi/index.vue
......@@ -131,6 +131,8 @@
</template>
<script>
import { query_jia_gou_yuan_su_guan_xi_table } from '@/api/index.js';
import axios from 'axios';
export default {
name: 'JiaGouYuanShuGuanLi',
......@@ -157,6 +159,33 @@ export default {
};
},
mounted(){
this.get_table();
},
methods: {
get_table() {
const params = {
"current": 0,
"delFlag": 0,
"elementName": "",
"id": "",
"pageSize": 0,
"schemaBelong": 0,
"state": 0
};
query_jia_gou_yuan_su_guan_xi_table(params).then(res => {
console.log(res);
})
// axios.get('http://43.143.211.42:7003/ele/', { params }).then(
// response=>{
// console.log("请求成功了,",response)
// },
// error=>{
// console.log("请求失败了，",error.messages)
// }
// )
}
}
}
</script>
<style scoped>
......
src/views/JiaGouYuanSuGuanxiGuanLi/index.vue deleted 100644 → 0
<template>
<div class="JiaGouYuanShuGuanLi">
<div class="table_container">
<div class="search_menu">
<div class="search_menu_item_container">
<div class="search_menu_item">
<span class="search_title">元素关系名称</span>
<el-input v-model="query_item3" placeholder="请输入内容" class="search_item"></el-input>
</div>
<div class="search_menu_item">
<span class="search_title">架构归属</span>
<el-select v-model="query_item1" placeholder="请选择" class="search_item">
<el-option label="业务架构" value="业务架构"></el-option>
<el-option label="应用架构" value="应用架构"></el-option>
<el-option label="内容架构" value="内容架构"></el-option>
<el-option label="技术架构" value="技术架构"></el-option>
<el-option label="安全架构" value="安全架构"></el-option>
</el-select>
</div>
<div class="search_menu_item">
<span class="search_title">状态</span>
<el-select v-model="query_item4" placeholder="请选择" class="search_item">
<el-option label="已发布" value="已发布"></el-option>
<el-option label="已停用" value="已停用"></el-option>
<el-option label="暂存" value="暂存"></el-option>
</el-select>
</div>
</div>
<div class="search_menu_btn_container">
<div class="query_btn">
<img class="btn_icon" src="@/assets/查询icon.png" alt="" />
<p>查询</p>
</div>
<div class="reset_btn">
<img class="btn_icon" src="@/assets/重置icon.png" alt="" />
<p>重置</p>
</div>
</div>
</div>
<div class="search_btn">
<div class="add_btn" @click="add_dialog = true">
<img class="btn_icon" src="@/assets/新建icon.png" alt="" />
<p>新建</p>
</div>
<div class="version_btn">
<img class="btn_icon" src="@/assets/版本发布icon.png" alt="" />
<p>版本发布</p>
</div>
</div>
<el-table :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="let1" label="元素关系名称" width="180" align="center"></el-table-column>
<el-table-column prop="let2" label="对象1" width="180" align="center"></el-table-column>
<el-table-column prop="let7" label="对象1" width="180" align="center"></el-table-column>
<el-table-column prop="let3" label="适用范围" width="180" align="center"></el-table-column>
<el-table-column prop="let4" label="关系描述" width="180" align="center"></el-table-column>
<el-table-column label="图标" align="center">
<template>
<el-button type="text" style="color: #0D867F;">预览</el-button>
</template>
</el-table-column>
<el-table-column prop="let5" label="版本" width="180" align="center"></el-table-column>
<el-table-column prop="let6" label="状态" align="center"></el-table-column>
<el-table-column label="操作" width="360" align="center">
<template>
<div style="display: flex;align-items: center;justify-content: center;">
<div class="add_btn" @click="add_dialog = true" style="border: 0;margin-right: 8px;">
<img class="btn_icon" src="@/assets/编辑_icon_default.png" alt="" />
<p>编辑</p>
</div>
<!-- <el-button type="text" icon="el-icon-edit" @click="add_dialog = true">编辑</el-button> -->
<div class="reset_btn" style="border: 0;margin-right: 8px;">
<img class="btn_icon" src="@/assets/停用_icon_default.png" alt="" />
<p>停用</p>
</div>
<div class="add_btn" style="border: 0;margin-right: 8px;">
<img class="btn_icon" src="@/assets/发布_icon_default.png" alt="" />
<p>发布</p>
</div>
<div class="reset_btn" style="border: 0;">
<img class="btn_icon" src="@/assets/删除_icon_default.png" alt="" />
<p>删除</p>
</div>
</div>
</template>
</el-table-column>
</el-table>
<el-pagination
background
layout="prev, pager, next"
:total="50">
</el-pagination>
</div>
<el-dialog
title="新建元素关系"
:visible.sync="add_dialog"
:center="false"
width="40%">
<div class="add_dialog_content">
<div class="dialog_form_item">
<div class="dialog_form_item_title">*元素关系名称</div>
<el-input placeholder="请输入内容" class="dialog_form_item_content" v-model="let1"></el-input>
</div>
<!-- <div class="dialog_form_item">
<div class="dialog_form_item_title">元素关系描述</div>
<el-input placeholder="请输入内容" class="dialog_form_item_content" v-model="let2"></el-input>
</div> -->
<!-- <div class="dialog_form_item">
<div class="dialog_form_item_title">架构归属</div>
<el-select placeholder="请选择" class="search_item" v-model="let3">
<el-option label="业务架构" value="业务架构"></el-option>
<el-option label="应用架构" value="应用架构"></el-option>
<el-option label="内容架构" value="内容架构"></el-option>
<el-option label="技术架构" value="技术架构"></el-option>
<el-option label="安全架构" value="安全架构"></el-option>
</el-select>
</div> -->
<div class="dialog_form_item">
<div class="dialog_form_item_title">*元素关系描述</div>
<el-input type="textarea" :rows="2" placeholder="请输入内容" class="dialog_form_item_content" v-model="let4"></el-input>
</div>
</div>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="add_dialog = false">发布</el-button>
<el-button type="primary" @click="add_dialog = false">暂存</el-button>
<el-button @click="add_dialog = false">取消</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
export default {
name: 'JiaGouYuanShuGuanLi',
components: {
},
data() {
return {
tableData: [
{ let1: '分解', let2: '业务域', let7: '业务职能', let3: '业务架构', let4: '业务域的基本描述', let5: '2023.10.31', let6: '已发布' },
{ let1: '支撑', let2: '业务域', let7: '业务职能', let3: '业务架构', let4: '业务职能的描述', let5: '2023.10.31', let6: '已发布' },
{ let1: '聚合', let2: '应用域', let7: '应用职能', let3: '应用架构', let4: '应用交互的基本描述', let5: '2023.10.31', let6: '已发布' },
],
add_dialog: false,
query_item1: null,
query_item3: null,
query_item4: null,
let1: '',
let2: '',
let3: '',
let4: '',
};
},
}
</script>
<style scoped>
.JiaGouYuanShuGuanLi{
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
}
.search_menu{
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;
}
.add_btn{
display: flex;
align-items: center;
justify-content: center;
width: 76px;
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;
}
.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;
}
.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 #0D867F;
font-size: 14px;
color: #666;
cursor: pointer;
}
.btn_icon{
margin-right: 10px;
}
.table_container{
width: 97%;
margin-top: 20px;
}
.el-pagination{
margin-top: 50px;
}
.dialog_form_item{
display: flex;
align-items: center;
margin-bottom: 10px;
}
.dialog_form_item_title{
flex-shrink: 0;
margin-right: 15px;
}
/deep/ .el-dialog__header{
text-align: left;
}
/deep/ .el-pagination.is-background .el-pager li:not(.disabled).active{
background-color: #0D867F;
}
</style>
\ No newline at end of file
src/views/Main/index.vue
......@@ -68,7 +68,7 @@
<span style="margin-left: 5px;">架构视图管理</span>
</div>
<div class="menu_1_item_subtitle">
<div class="menu_1_item_subtitle" @click="jumpPage('总体架构资产设计与维护', '架构元模型管理', '新页面')">
<img src="@/assets/三级圆环.png" alt="">
<span style="margin-left: 5px;">架构视图管理</span>
</div>
......@@ -528,7 +528,7 @@
this.visible1 = false;
break;
case '架构元素关系管理':
this.$router.push( '/main/JiaGouYuanSuGuanxiGuanLi', () => {}, () => {} );
this.$router.push( '/main/JiaGouYuanSuGuanXiGuanLi', () => {}, () => {} );
this.visible1 = false;
break;
case '架构视图配置':
......@@ -555,8 +555,9 @@
this.visible1 = false;
break;
case '架构元素关系管理':
this.$router.push( '/main/JiaGouYuanShuGuanXiGuanLi', () => {}, () => {} );
case '新页面':
console.log(12)
this.$router.push( '/main/NewPage', () => {}, () => {} );
this.visible1 = false;
break;
......
src/views/NewPage/index.vue 0 → 100644
<template>
<div class="NewPage">
<div class="table_container">
<el-table :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="let1" label="元素名称" align="center"></el-table-column>
<el-table-column prop="let2" label="元素id" align="center"></el-table-column>
<el-table-column prop="let3" label="关联元素名称" align="center"></el-table-column>
<el-table-column prop="let4" label="关联元素id" align="center"></el-table-column>
<el-table-column prop="let4" label="关联关系名称" align="center"></el-table-column>
<el-table-column prop="let4" label="关联关系描述" align="center"></el-table-column>
<el-table-column prop="let4" label="方向" align="center"></el-table-column>
<el-table-column label="操作" align="center">
<template>
<div style="display: flex;align-items: center;justify-content: center;">
<div class="add_btn" @click="add_dialog = true" style="border: 0;margin-right: 8px;">
<!-- <img class="btn_icon" src="@/assets/编辑_icon_default.png" alt="" /> -->
<p>编辑</p>
</div>
<div class="reset_btn" style="border: 0;margin-right: 8px;">
<!-- <img class="btn_icon" src="@/assets/停用_icon_default.png" alt="" /> -->
<p>停用</p>
</div>
<div class="add_btn" style="border: 0;margin-right: 8px;">
<!-- <img class="btn_icon" src="@/assets/发布_icon_default.png" alt="" /> -->
<p>发布</p>
</div>
<div class="reset_btn" style="border: 0;">
<!-- <img class="btn_icon" src="@/assets/删除_icon_default.png" alt="" /> -->
<p>删除</p>
</div>
</div>
</template>
</el-table-column>
</el-table>
<el-pagination
background
layout="prev, pager, next"
:total="50">
</el-pagination>
</div>
<el-dialog
title="新建元素"
:visible.sync="add_dialog"
:center="false"
width="40%">
<div class="add_dialog_content">
<div class="dialog_form_item">
<div class="dialog_form_item_title">元素名称</div>
<el-input placeholder="请输入内容" class="dialog_form_item_content" v-model="let1"></el-input>
</div>
<div class="dialog_form_item">
<div class="dialog_form_item_title">架构层次</div>
<el-input placeholder="请输入内容" class="dialog_form_item_content" v-model="let2"></el-input>
</div>
<div class="dialog_form_item">
<div class="dialog_form_item_title">架构归属</div>
<el-select placeholder="请选择" class="search_item" v-model="let3">
<el-option label="业务架构" value="业务架构"></el-option>
<el-option label="应用架构" value="应用架构"></el-option>
<el-option label="内容架构" value="内容架构"></el-option>
<el-option label="技术架构" value="技术架构"></el-option>
<el-option label="安全架构" value="安全架构"></el-option>
</el-select>
</div>
<div class="dialog_form_item">
<div class="dialog_form_item_title">描述</div>
<el-input type="textarea" :rows="2" placeholder="请输入内容" class="dialog_form_item_content" v-model="let4"></el-input>
</div>
</div>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="add_dialog = false">发布</el-button>
<el-button type="primary" @click="add_dialog = false">暂存</el-button>
<el-button @click="add_dialog = false">取消</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
export default {
name: 'NewPage',
components: {
},
data() {
return {
tableData: [
{ let1: '业务域', let2: '策略层', let3: '业务架构', let4: '业务域的基本描述', let5: '2023.10.31', let6: '已发布' },
{ let1: '业务职能', let2: '策略层', let3: '业务架构', let4: '业务职能的描述', let5: '2023.10.31', let6: '已发布' },
{ let1: '应用交互', let2: '策略层', let3: '应用架构', let4: '应用交互的基本描述', let5: '2023.10.31', let6: '已发布' },
{ let1: '功能', let2: '策略层', let3: '应用架构', let4: '功能的描述', let5: '2023.09.17', let6: '暂存' },
{ let1: '业务域', let2: '策略层', let3: '业务架构', let4: '业务域的基本描述', let5: '2023.08.18', let6: '已停用' },
],
};
},
}
</script>
<style scoped>
.NewPage{
width: 100%;
height: 100%;
}
.table_container{
width: 97%;
margin-top: 20px;
}
.el-pagination{
margin-top: 50px;
}
/deep/ .el-dialog__header{
text-align: left;
}
/deep/ .el-pagination.is-background .el-pager li:not(.disabled).active{
background-color: #0D867F;
}
</style>
\ No newline at end of file
vue.config.js
const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
transpileDependencies: true,
chainWebpack: config => {
config
.plugin('html')
.tap(args => {
args[0].title = '数字化架构设计与管控微应用'
return args
})},
transpileDependencies: true,
//如果是hash模式， publicPath:""；如果是history， publicPath:"/"
// publicPath: "/",
devServer: {
proxy: {
'/api': {
target: 'http://43.143.211.42:7003',
changeOrigin: true,
secure: false,
rewrite: path => path.replace(/^\/api/, '')
}
}
},
chainWebpack: config => {
config.plugin('html').tap(args => {
args[0].title = '数字化架构设计与管控微应用';
return args;
})
},
})
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!