Skip to content

liangzhen / framework-tools-web

Go to a project
Commit 4c15bbd7 by 史敦盼
Options

架构元素管理修改

1 parent 7a280f14
Expand all
Inline Side-by-side
Showing with 160 additions and 44 deletions
src/utils/index.js
...@@ -51,3 +51,13 @@ export async function getDictTypeOptions(key) { ...@@ -51,3 +51,13 @@ export async function getDictTypeOptions(key) {
// console.log('dictTypeOptions', dictTypeOptions) // console.log('dictTypeOptions', dictTypeOptions)
return dictTypeOptions return dictTypeOptions
} }
/**
* @description: svg字符串转base64
* @param {String} svgCode
* @return {String} base64
* @author: pan
*/
export function svgToBase64(svgCode) {
const utf8Bytes = new TextEncoder().encode(svgCode);
return 'data:image/svg+xml;base64,' + btoa(String.fromCharCode.apply(null, utf8Bytes));
}
src/views/archi-view-manage/index.vue
...@@ -15,12 +15,12 @@ ...@@ -15,12 +15,12 @@
</el-tree> </el-tree>
<div class="right_container"> <div class="right_container">
<el-tabs v-model="activeName" type="border-card"> <el-tabs v-model="activeName" type="border-card">
<el-tab-pane label="暂存" name="暂存"> <el-tab-pane label="发布" name="发布">
<div class="card_container"> <div class="card_container">
<div class="card_body"> <div class="card_body">
<el-card <el-card
class="card_item" class="card_item"
v-for="item in zanCun" v-for="item in yiFaBu"
:key="item.metaModelId" :key="item.metaModelId"
> >
<img <img
...@@ -42,38 +42,38 @@ ...@@ -42,38 +42,38 @@
<i class="el-icon-location"></i> <i class="el-icon-location"></i>
{{ item.verName }}&nbsp;&nbsp;&nbsp;{{ item.version }} {{ item.verName }}&nbsp;&nbsp;&nbsp;{{ item.version }}
</div> </div>
<div class="card_icon" @click.stop="deleteItem(item)"> <!-- <div class="card_icon" @click.stop="deleteItem(item)">
<i class="el-icon-delete"></i> <i class="el-icon-delete"></i>
</div> </div> -->
</div> </div>
</el-card> </el-card>
<div <!-- <div
v-if="viewId" v-if="viewId"
class="add_container" class="add_container"
@click="open_dialog('暂存')" @click="open_dialog('发布')"
> >
<i class="el-icon-plus"></i> <i class="el-icon-plus"></i>
</div> </div> -->
</div> </div>
</div> </div>
<el-pagination <el-pagination
background background
@size-change="(val) => handleSizeChange(val, '暂存')" @size-change="(val) => handleSizeChange(val, '发布')"
@current-change="(val) => handleCurrentChange(val, '暂存')" @current-change="(val) => handleCurrentChange(val, '发布')"
:current-page="pager2.current" :current-page="pager1.current"
:page-sizes="pager2.sizes" :page-sizes="pager1.sizes"
:page-size="pager2.size" :page-size="pager1.size"
layout="total, sizes, prev, pager, next, jumper" layout="total, sizes, prev, pager, next, jumper"
:total="pager2.total" :total="pager1.total"
> >
</el-pagination> </el-pagination>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="停用" name="停用"> <el-tab-pane label="暂存" name="暂存">
<div class="card_container"> <div class="card_container">
<div class="card_body"> <div class="card_body">
<el-card <el-card
class="card_item" class="card_item"
v-for="item in tingYong" v-for="item in zanCun"
:key="item.metaModelId" :key="item.metaModelId"
> >
<img <img
...@@ -103,7 +103,7 @@ ...@@ -103,7 +103,7 @@
<div <div
v-if="viewId" v-if="viewId"
class="add_container" class="add_container"
@click="open_dialog('停用')" @click="open_dialog('暂存')"
> >
<i class="el-icon-plus"></i> <i class="el-icon-plus"></i>
</div> </div>
...@@ -111,22 +111,22 @@ ...@@ -111,22 +111,22 @@
</div> </div>
<el-pagination <el-pagination
background background
@size-change="(val) => handleSizeChange(val, '停用')" @size-change="(val) => handleSizeChange(val, '暂存')"
@current-change="(val) => handleCurrentChange(val, '停用')" @current-change="(val) => handleCurrentChange(val, '暂存')"
:current-page="pager3.current" :current-page="pager2.current"
:page-sizes="pager3.sizes" :page-sizes="pager2.sizes"
:page-size="pager3.size" :page-size="pager2.size"
layout="total, sizes, prev, pager, next, jumper" layout="total, sizes, prev, pager, next, jumper"
:total="pager3.total" :total="pager2.total"
> >
</el-pagination> </el-pagination>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="发布" name="发布"> <el-tab-pane label="停用" name="停用">
<div class="card_container"> <div class="card_container">
<div class="card_body"> <div class="card_body">
<el-card <el-card
class="card_item" class="card_item"
v-for="item in yiFaBu" v-for="item in tingYong"
:key="item.metaModelId" :key="item.metaModelId"
> >
<img <img
...@@ -148,15 +148,15 @@ ...@@ -148,15 +148,15 @@
<i class="el-icon-location"></i> <i class="el-icon-location"></i>
{{ item.verName }}&nbsp;&nbsp;&nbsp;{{ item.version }} {{ item.verName }}&nbsp;&nbsp;&nbsp;{{ item.version }}
</div> </div>
<!-- <div class="card_icon" @click.stop="deleteItem(item)"> <div class="card_icon" @click.stop="deleteItem(item)">
<i class="el-icon-delete"></i> <i class="el-icon-delete"></i>
</div> --> </div>
</div> </div>
</el-card> </el-card>
<div <div
v-if="viewId" v-if="viewId"
class="add_container" class="add_container"
@click="open_dialog('发布')" @click="open_dialog('停用')"
> >
<i class="el-icon-plus"></i> <i class="el-icon-plus"></i>
</div> </div>
...@@ -164,16 +164,17 @@ ...@@ -164,16 +164,17 @@
</div> </div>
<el-pagination <el-pagination
background background
@size-change="(val) => handleSizeChange(val, '发布')" @size-change="(val) => handleSizeChange(val, '停用')"
@current-change="(val) => handleCurrentChange(val, '发布')" @current-change="(val) => handleCurrentChange(val, '停用')"
:current-page="pager1.current" :current-page="pager3.current"
:page-sizes="pager1.sizes" :page-sizes="pager3.sizes"
:page-size="pager1.size" :page-size="pager3.size"
layout="total, sizes, prev, pager, next, jumper" layout="total, sizes, prev, pager, next, jumper"
:total="pager1.total" :total="pager3.total"
> >
</el-pagination> </el-pagination>
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
</div> </div>
<el-dialog <el-dialog
...@@ -233,7 +234,7 @@ export default { ...@@ -233,7 +234,7 @@ export default {
], ],
treeDefaultExpand: [], treeDefaultExpand: [],
currentNodekey: null, currentNodekey: null,
activeName: '暂存', activeName: '发布',
pager1: { pager1: {
current: 1, current: 1,
sizes: [10, 20, 50, 100, 200], sizes: [10, 20, 50, 100, 200],
......
src/views/archiViewConfig/index.vue
...@@ -1208,6 +1208,16 @@ export default { ...@@ -1208,6 +1208,16 @@ export default {
} }
}) })
} else if (type == 'pushAdd') { } else if (type == 'pushAdd') {
this.$refs.viewForm.validate((valid) => {
if (valid) {
if (!this.formData.eleName) {
this.$message.error('请勾选元素范围')
return
}
if (!this.formData.relName) {
this.$message.error('请勾选元素关系范围')
return
}
this.formData.state = 1 this.formData.state = 1
// this.formData.eleName = this.selectData1.join(","); // this.formData.eleName = this.selectData1.join(",");
// this.formData.archiEleId = this.selectData2.join(","); // this.formData.archiEleId = this.selectData2.join(",");
...@@ -1242,6 +1252,8 @@ export default { ...@@ -1242,6 +1252,8 @@ export default {
} }
}) })
} }
}
})
} else if (type == 'pushEdit') { } else if (type == 'pushEdit') {
// 编辑发布 // 编辑发布
this.$confirm('确认发布吗', '提示', { this.$confirm('确认发布吗', '提示', {
......
src/views/meta-model-list/DetailLegend.vue
...@@ -4,14 +4,100 @@ ...@@ -4,14 +4,100 @@
* @Autor: pan * @Autor: pan
* @Date: 2024-04-02 17:10:55 * @Date: 2024-04-02 17:10:55
* @LastEditors: pan * @LastEditors: pan
* @LastEditTime: 2024-04-02 17:44:41 * @LastEditTime: 2024-04-03 09:28:23
--> -->
<template> <template>
<div class="legend flex"> <div class="legend flex">
<span class="m-r-20">图例:</span> <span class="m-r-20">图例:</span>
<div class="flex-c" v-for="(item, idx) in items" :key="idx"> <div class="flex-c" v-for="(item, idx) in items" :key="idx">
<span class="icon m-r-6 m-l-10" :style="{backgroundColor: item.color}"></span> <span
<span class="name">{{item.name}}</span> class="icon m-r-6 m-l-10"
:style="{ backgroundColor: item.color }"
></span>
<span class="name">{{ item.name }}</span>
</div>
<div class="flex-c m-r-10">
<svg
t="1712105996408"
viewBox="0 0 3736 1024"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
p-id="8364"
width="16"
height="16"
>
<path
d="M0 595.324463h2706.21085l-182.370522 428.675537 1212.65916-511.475947L2523.840328 0l182.370522 428.675537H0v166.648926z"
p-id="8365"
></path>
</svg>
<span class="name">元素间关系</span>
</div>
<div class="flex-c m-r-10">
<svg
t="1712106373997"
viewBox="0 0 1024 1024"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
p-id="9722"
width="16"
height="16"
>
<path d="M0 0h1024v1024H0z" fill-opacity="0" p-id="9723"></path>
<path
d="M888 318.464l-9.856-17.984a439.424 439.424 0 0 0-385.152-228.416A440.448 440.448 0 0 0 53.056 512a440.32 440.32 0 0 0 439.936 439.936 441.472 441.472 0 0 0 419.264-307.712h-66.112a377.984 377.984 0 0 1-353.152 245.184c-208.064 0-377.408-169.344-377.408-377.408s169.344-377.344 377.408-377.344a375.424 375.424 0 0 1 348.544 235.904l8.384 20.736"
fill="#323333"
p-id="9724"
></path>
<path
d="M603.52 268.288l-19.136 61.056 328.064 102.784 58.496-305.152-62.912-12.032-44.928 234.624z"
fill="#333333"
p-id="9725"
></path>
</svg>
<span class="name">元素自嵌套关系</span>
</div>
<div class="flex-c m-r-10">
<span class="circle"></span>
<span class="name">总体架构元素</span>
</div>
<div class="flex-c m-r-10">
<svg
t="1712107200597"
viewBox="0 0 1024 1024"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
p-id="15801"
width="18"
height="18"
>
<path
d="M512 70.62069C268.535172 70.62069 70.62069 268.711724 70.62069 512s197.914483 441.37931 441.37931 441.37931 441.37931-197.914483 441.37931-441.37931S755.464828 70.62069 512 70.62069z m361.048276 441.37931c0 65.324138-17.478621 126.411034-47.845517 179.376552l-311.26069-540.248276c198.091034 0.882759 359.106207 162.427586 359.106207 360.871724z m-122.88 183.437241L272.41931 692.082759l236.932414-414.896552 240.816552 418.251034zM504.055172 151.128276L197.208276 688.551724C167.724138 636.292414 150.951724 576.088276 150.951724 512c0-196.325517 157.66069-356.457931 353.103448-360.871724z m7.944828 721.92c-103.635862 0-197.208276-43.961379-263.062069-114.228966l522.769655 3.707587c-65.853793 67.972414-157.837241 110.521379-259.707586 110.521379z"
p-id="15802"
data-spm-anchor-id="a313x.search_index.0.i25.41143a81MFjoUU"
class="selected"
fill="#515151"
></path>
</svg>
<span class="name">同属总体与系统架构的元素</span>
</div>
<div class="flex-c m-r-10">
<svg
t="1712107365396"
viewBox="0 0 1024 1024"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
p-id="17850"
width="14"
height="14"
>
<path
d="M469.674667 34.816L28.416 956.842667A46.933333 46.933333 0 0 0 70.826667 1024H953.173333a46.933333 46.933333 0 0 0 42.368-67.2L554.325333 34.773333a46.933333 46.933333 0 0 0-84.650666 0zM512 144l380.245333 794.624H131.712L512 144z"
fill="#191919"
p-id="17851"
></path>
</svg>
<span class="name">系统架构元素</span>
</div> </div>
</div> </div>
</template> </template>
...@@ -23,25 +109,25 @@ export default { ...@@ -23,25 +109,25 @@ export default {
items: [ items: [
{ {
name: '业务架构元素', name: '业务架构元素',
color: '#d2edfd' color: '#d2edfd',
}, },
{ {
name: '应用架构元素', name: '应用架构元素',
color: '#a0ce62' color: '#a0ce62',
}, },
{ {
name: '数据架构元素', name: '数据架构元素',
color: '#fbe8d0' color: '#fbe8d0',
}, },
{ {
name: '技术架构元素', name: '技术架构元素',
color: '#e4d3fc' color: '#e4d3fc',
}, },
{ {
name: '安全架构元素', name: '安全架构元素',
color: '#fffe55' color: '#fffe55',
} },
] ],
} }
}, },
} }
...@@ -57,6 +143,7 @@ export default { ...@@ -57,6 +143,7 @@ export default {
padding: 20px 16px; padding: 20px 16px;
width: calc(100% - 540px); width: calc(100% - 540px);
flex-wrap: wrap; flex-wrap: wrap;
align-items: center;
font-size: 12px; font-size: 12px;
.icon { .icon {
width: 24px; width: 24px;
...@@ -64,5 +151,11 @@ export default { ...@@ -64,5 +151,11 @@ export default {
border-radius: 4px; border-radius: 4px;
border: 1px solid #333; border: 1px solid #333;
} }
.circle {
border: 1px solid #333;
border-radius: 50%;
width: 16px;
height: 16px;
}
} }
</style> </style>
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!