Skip to content
Toggle navigation
P
Projects
G
Groups
S
Snippets
Help
liangzhen
/
framework-tools-web
This project
Loading...
Sign in
Toggle navigation
Go to a project
Project
Repository
Issues
0
Merge Requests
0
Pipelines
Wiki
Snippets
Settings
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Commit ca4b185a
authored
Jan 25, 2024
by
liuyong
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
修改画布
1 parent
03b9666a
Hide whitespace changes
Inline
Side-by-side
Showing
9 changed files
with
67 additions
and
46 deletions
public/drawio/extention/js/exApp.js
public/drawio/extention/js/exFormat.js
public/drawio/extention/js/exGraph.js
public/drawio/js/diagramly/Minimal.js
public/drawio/js/grapheditor/Format.js
public/drawio/js/grapheditor/Sidebar.js
src/views/archi-ele-list/index.vue
src/views/archi-view-manage/canvas/index.vue
src/views/meta-model-list/canvas/index.vue
public/drawio/extention/js/exApp.js
View file @
ca4b185
...
...
@@ -19,7 +19,7 @@ const initDrawioGraph = function(that) {//一进入画布显示的图形
let
eleBelongId
=
receiveData
.
eleBelongId
;
let
dicys
=
JSON
.
stringify
(
receiveData
.
dicys
);
that
.
editor
.
graph
.
getSelectionCells
().
forEach
(
item
=>
{
if
(
item
.
value
.
length
>
0
)
{
if
(
item
.
value
)
{
if
(
that
.
editor
.
graph
.
getModel
().
isVertex
(
item
)){
// console.log('封闭图形');
that
.
editor
.
graph
.
setCellStyles
(
'attr'
,
dicys
,
[
item
]);
...
...
@@ -114,9 +114,6 @@ const setIcon = function (itemIcon, dicys, color) {
// ];
const
leftCustomGraph
=
function
(
that
)
{
//左侧自定义图形
const
leftGraph
=
JSON
.
parse
(
localStorage
.
getItem
(
'leftGraph'
));
leftGraph
.
forEach
(
function
(
item
)
{
if
(
item
.
eleDtos
)
{
...
...
public/drawio/extention/js/exFormat.js
View file @
ca4b185
...
...
@@ -191,16 +191,16 @@ const addListPanel = function(that, originAttr, attrName_, attrValue_) {
}
//初始化右侧属性面板控件
const
attributeNode
=
function
(
that
,
label3
,
div
,
ui
,
addClickHandler
,
idx
)
{
var
label4
=
label3
.
cloneNode
(
false
);
//二次开发,自己写的属性面板
label4
.
style
.
backgroundColor
=
Format
.
inactiveTabBackgroundColor
;
mxUtils
.
write
(
label4
,
mxResources
.
get
(
'attribute'
));
div
.
appendChild
(
label4
);
var
attributePanel
=
div
.
cloneNode
(
false
);
attributePanel
.
style
.
display
=
'none'
;
that
.
panels
.
push
(
new
AttributePanel
(
that
,
ui
,
attributePanel
));
that
.
container
.
appendChild
(
attributePanel
);
addClickHandler
(
label4
,
attributePanel
,
idx
++
,
true
);
}
\ No newline at end of file
// const attributeNode = function(that, label3, div, ui, addClickHandler, idx) {
// var label4 = label3.cloneNode(false);//二次开发,自己写的属性面板
// label4.style.backgroundColor = Format.inactiveTabBackgroundColor;
// mxUtils.write(label4, mxResources.get('attribute'));
// div.appendChild(label4);
// var attributePanel = div.cloneNode(false);
// attributePanel.style.display = 'none';
// that.panels.push(new AttributePanel(that, ui, attributePanel));
// that.container.appendChild(attributePanel);
// addClickHandler(label4, attributePanel, idx++, true);
// }
\ No newline at end of file
public/drawio/extention/js/exGraph.js
View file @
ca4b185
...
...
@@ -48,13 +48,6 @@
item
.
eleDtos
.
forEach
(
item2
=>
{
if
(
item2
.
icon
)
{
if
(
item2
.
icon
.
includes
(
'data'
))
{
// const item_icon = item2.icon.split("base64,")[1];
// const decode_item_icon = (window.atob) ? atob(item_icon) : Base64.decode(item_icon);//svg解码,为字符串
// const svgDocument = new DOMParser().parseFromString(decode_item_icon, 'text/xml');//svg字符串转标签
// const svgTag = svgDocument.getElementsByTagName('svg')[0];
// const width = +svgTag.getAttribute('width').split("px")[0];
// const height = +svgTag.getAttribute('height').split("px")[0];
let
attr_
=
[];
if
(
item2
.
dicys
&&
item2
.
dicys
.
length
>
0
)
{
...
...
public/drawio/js/diagramly/Minimal.js
View file @
ca4b185
...
...
@@ -168,6 +168,7 @@ EditorUi.initMinimalTheme = function()
ui
.
sidebarWindow
=
new
WrapperWindow
(
ui
,
mxResources
.
get
(
'shapes'
),
10
,
56
,
w
-
6
,
h
-
6
,
function
(
container
)
{
createSidebar
(
ui
,
container
);
});
...
...
public/drawio/js/grapheditor/Format.js
View file @
ca4b185
...
...
@@ -367,10 +367,12 @@ Format.prototype.immediateRefresh = function()
(
containsLabel
?
'50%'
:
'25%'
);
//二次开发,调整右侧面板每个的宽度从33.3%改成25%
var
label2
=
label
.
cloneNode
(
false
);
var
label3
=
label2
.
cloneNode
(
false
);
var
label4
=
label3
.
cloneNode
(
false
);
//二次开发,自己写的属性面板
// Workaround for ignored background in IE
label2
.
style
.
backgroundColor
=
Format
.
inactiveTabBackgroundColor
;
label3
.
style
.
backgroundColor
=
Format
.
inactiveTabBackgroundColor
;
label4
.
style
.
backgroundColor
=
Format
.
inactiveTabBackgroundColor
;
//二次开发,自己写的属性面板
// Style
if
(
containsLabel
)
...
...
@@ -409,8 +411,14 @@ Format.prototype.immediateRefresh = function()
this
.
panels
.
push
(
new
ArrangePanel
(
this
,
ui
,
arrangePanel
));
this
.
container
.
appendChild
(
arrangePanel
);
const
that
=
this
;
attributeNode
(
that
,
label3
,
div
,
ui
,
addClickHandler
,
idx
);
mxUtils
.
write
(
label4
,
mxResources
.
get
(
'attribute'
));
//二次开发,自己写的属性面板
div
.
appendChild
(
label4
);
//二次开发,自己写的属性面板
var
attributePanel
=
div
.
cloneNode
(
false
);
//二次开发,自己写的属性面板
attributePanel
.
style
.
display
=
'none'
;
//二次开发,自己写的属性面板
this
.
panels
.
push
(
new
AttributePanel
(
this
,
ui
,
attributePanel
));
this
.
container
.
appendChild
(
attributePanel
);
//二次开发,自己写的属性面板
if
(
ss
.
cells
.
length
>
0
)
{
addClickHandler
(
label2
,
textPanel
,
idx
+
1
);
...
...
@@ -421,6 +429,7 @@ Format.prototype.immediateRefresh = function()
}
addClickHandler
(
label3
,
arrangePanel
,
idx
++
,
true
);
addClickHandler
(
label4
,
attributePanel
,
idx
++
,
true
);
//二次开发,自己写的属性面板
}
};
...
...
public/drawio/js/grapheditor/Sidebar.js
View file @
ca4b185
...
...
@@ -2189,6 +2189,14 @@ Sidebar.prototype.createTitle = function(label)
var
elt
=
document
.
createElement
(
'a'
);
elt
.
setAttribute
(
'title'
,
mxResources
.
get
(
'sidebarTooltip'
));
elt
.
className
=
'geTitle'
;
//二次开发,设置样式--------------------开始
if
(
label
==
'架构元素关系'
)
{
elt
.
style
.
borderTop
=
'2px solid #ccc'
;
elt
.
style
.
borderBottom
=
'2px solid #ccc'
;
}
else
{
elt
.
style
.
border
=
'none'
;
}
//二次开发,设置样式--------------------结束
mxUtils
.
write
(
elt
,
label
);
return
elt
;
};
...
...
src/views/archi-ele-list/index.vue
View file @
ca4b185
...
...
@@ -191,22 +191,29 @@
:before-close=
"closeGraphDialog"
:close-on-click-modal=
"false"
width=
"60%"
>
<div
style=
"height: 400px;display: flex;align-items: center;"
>
<div
style=
"width: 20%;height: 100%;border-left: 1px solid #ccc;border-top: 1px solid #ccc;border-bottom: 1px solid #ccc;overflow: auto;text-align: center;"
>
<div
:style=
"{ 'cursor': 'pointer', 'padding': '4px', 'background-color': nameIndex == index ? 'rgb(13,134,127)' : '#fff', 'color': nameIndex == index ? '#fff' : '#000' }"
v-for=
"(item, index) in search_select1"
:key=
"item.belongId"
@
click=
"showCurrentGraph(item.name, index)"
>
{{ item.name }}
</div>
</div>
<div
style=
"width: 80%;height: 100%;border: 1px solid #ccc;overflow: auto;text-align: left;"
>
<div
:style=
"{ 'display': 'inline-block','margin': '10px', 'border': graphIndex == index ? '2px solid #0D867F' : 'none','padding': '8px', 'border-radius': '6px' }"
v-for=
"(item, index) in graphList"
:key=
"item.graphId"
>
<img
@
click=
"clickGraph(index)"
class=
"tu_biao_icon"
:src=
"'data:image/svg+xml;base64,'+item.icon"
alt=
""
/>
<el-tabs
type=
"border-card"
>
<el-tab-pane
label=
"标准图元"
style=
"height: 400px;"
>
</el-tab-pane>
<el-tab-pane
label=
"常规图元"
style=
"height: 400px;"
>
<div
style=
"height: 400px;display: flex;align-items: center;"
>
<div
style=
"width: 20%;height: 100%;border-left: 1px solid #ccc;border-top: 1px solid #ccc;border-bottom: 1px solid #ccc;overflow: auto;text-align: center;"
>
<div
:style=
"{ 'cursor': 'pointer', 'padding': '4px', 'background-color': nameIndex == index ? 'rgb(13,134,127)' : '#fff', 'color': nameIndex == index ? '#fff' : '#000' }"
v-for=
"(item, index) in search_select1"
:key=
"item.belongId"
@
click=
"showCurrentGraph(item.name, index)"
>
{{ item.name }}
</div>
</div>
<div
style=
"width: 80%;height: 100%;border: 1px solid #ccc;overflow: auto;text-align: left;"
>
<div
:style=
"{ 'display': 'inline-block','margin': '10px', 'border': graphIndex == index ? '2px solid #0D867F' : 'none','padding': '8px', 'border-radius': '6px' }"
v-for=
"(item, index) in graphList"
:key=
"item.graphId"
>
<img
@
click=
"clickGraph(index)"
class=
"tu_biao_icon"
:src=
"'data:image/svg+xml;base64,'+item.icon"
alt=
""
/>
</div>
</div>
</div>
</
div
>
</
div
>
</
el-tab-pane
>
</
el-tabs
>
<span
slot=
"footer"
class=
"dialog-footer"
>
<el-button
class=
"greenButton"
@
click=
"save_graph"
>
确定
</el-button>
<el-button
@
click=
"closeGraphDialog"
>
取消
</el-button>
...
...
src/views/archi-view-manage/canvas/index.vue
View file @
ca4b185
...
...
@@ -29,14 +29,16 @@
</div>
</div>
<div
style=
"width: 80%;height: 100%;border: 1px solid #ccc;overflow: auto;text-align: left;"
>
<div
:style=
"
{ 'display': 'inline-block','margin': '10px', 'border': graphIndex == index ? '2px solid #0D867F' : 'none','padding': '8px', 'border-radius': '6px' }"
<div
:style=
"
{ 'display': 'inline-block',
'text-align': 'center',
'margin': '10px', 'border': graphIndex == index ? '2px solid #0D867F' : 'none','padding': '8px', 'border-radius': '6px' }"
v-for="(item, index) in graphList" :key="item.elementId">
<img
@
click=
"clickGraph(index)"
class=
"tu_biao_icon"
:src=
"item.icon"
alt=
""
/>
<br
/>
<span>
{{
item
.
eleName
?
item
.
eleName
:
item
.
elementName
}}
</span>
</div>
</div>
</div>
<span
slot=
"footer"
class=
"dialog-footer"
>
<el-button
class=
"greenButton"
@
click=
"confirm"
>
确定
</el-button>
<el-button
class=
"greenButton"
@
click=
"confirm"
>
关联
</el-button>
<el-button
@
click=
"closeGraphDialog"
>
取消
</el-button>
</span>
</el-dialog>
...
...
@@ -130,6 +132,7 @@
},
get_search_select1
()
{
//查询架构归属下拉框值
const
leftGraph
=
JSON
.
parse
(
localStorage
.
getItem
(
"leftGraph"
));
leftGraph
.
reverse
();
this
.
search_select1
=
leftGraph
;
},
closeGraphDialog
()
{
//图形选择窗口的取消
...
...
src/views/meta-model-list/canvas/index.vue
View file @
ca4b185
...
...
@@ -29,14 +29,16 @@
</div>
</div>
<div
style=
"width: 80%;height: 100%;border: 1px solid #ccc;overflow: auto;text-align: left;"
>
<div
:style=
"
{ 'display': 'inline-block','margin': '10px', 'border': graphIndex == index ? '2px solid #0D867F' : 'none','padding': '8px', 'border-radius': '6px' }"
<div
:style=
"
{ 'display': 'inline-block','
text-align': 'center', '
margin': '10px', 'border': graphIndex == index ? '2px solid #0D867F' : 'none','padding': '8px', 'border-radius': '6px' }"
v-for="(item, index) in graphList" :key="item.elementId">
<img
@
click=
"clickGraph(index)"
class=
"tu_biao_icon"
:src=
"item.icon"
alt=
""
/>
<br
/>
<span>
{{
item
.
eleName
?
item
.
eleName
:
item
.
elementName
}}
</span>
</div>
</div>
</div>
<span
slot=
"footer"
class=
"dialog-footer"
>
<el-button
class=
"greenButton"
@
click=
"confirm"
>
确定
</el-button>
<el-button
class=
"greenButton"
@
click=
"confirm"
>
关联
</el-button>
<el-button
@
click=
"closeGraphDialog"
>
取消
</el-button>
</span>
</el-dialog>
...
...
@@ -130,6 +132,7 @@
},
get_search_select1
()
{
//查询架构归属下拉框值
const
leftGraph
=
JSON
.
parse
(
localStorage
.
getItem
(
"leftGraph"
));
leftGraph
.
reverse
();
this
.
search_select1
=
leftGraph
;
},
closeGraphDialog
()
{
//图形选择窗口的取消
...
...
Write
Preview
Markdown
is supported
Attach a file
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to post a comment