style:设置曲线为直线
This commit is contained in:
@@ -2,7 +2,7 @@
|
|||||||
<div class="mc" @click.self="clickOutside">
|
<div class="mc" @click.self="clickOutside">
|
||||||
<div class="right-box right-box-edit-endpoint">
|
<div class="right-box right-box-edit-endpoint">
|
||||||
<!-- begin--顶部按钮-->
|
<!-- begin--顶部按钮-->
|
||||||
<div class="right-box-top-btns">
|
<div class="right-box-top-btns" v-if="lineData.id">
|
||||||
<button id="edit-ep-del" type="button" @click="del" class="nz-btn nz-btn-size-normal nz-btn-size-alien nz-btn-style-light ">
|
<button id="edit-ep-del" type="button" @click="del" class="nz-btn nz-btn-size-normal nz-btn-size-alien nz-btn-style-light ">
|
||||||
<span class="right-box-top-btn-icon"><i class="el-icon-delete"></i></span>
|
<span class="right-box-top-btn-icon"><i class="el-icon-delete"></i></span>
|
||||||
<span class="right-box-top-btn-txt">{{$t('overall.delete')}}</span>
|
<span class="right-box-top-btn-txt">{{$t('overall.delete')}}</span>
|
||||||
@@ -234,6 +234,8 @@
|
|||||||
if( this.lineData.expressions){
|
if( this.lineData.expressions){
|
||||||
this.lineData.expressions.forEach((item,index)=>{
|
this.lineData.expressions.forEach((item,index)=>{
|
||||||
console.log(this.$refs['promql-'+(index)],'promql-'+( index));
|
console.log(this.$refs['promql-'+(index)],'promql-'+( index));
|
||||||
|
console.log(this.expressions[index]);
|
||||||
|
this.$refs['promql-'+(index)][0].metricChange(this.expressions[index]);
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -2,11 +2,11 @@
|
|||||||
<div class="mc" @click.self="clickOutside">
|
<div class="mc" @click.self="clickOutside">
|
||||||
<div class="right-box right-box-edit-endpoint">
|
<div class="right-box right-box-edit-endpoint">
|
||||||
<!-- begin--顶部按钮-->
|
<!-- begin--顶部按钮-->
|
||||||
<div class="right-box-top-btns">
|
<div class="right-box-top-btns" v-if="nodeData.id">
|
||||||
<!--<button id="edit-ep-del" type="button" @click="del" class="nz-btn nz-btn-size-normal nz-btn-size-alien nz-btn-style-light ">-->
|
<button id="edit-ep-del" type="button" @click="del" class="nz-btn nz-btn-size-normal nz-btn-size-alien nz-btn-style-light ">
|
||||||
<!--<span class="right-box-top-btn-icon"><i class="el-icon-delete"></i></span>-->
|
<span class="right-box-top-btn-icon"><i class="el-icon-delete"></i></span>
|
||||||
<!--<span class="right-box-top-btn-txt">{{$t('overall.delete')}}</span>-->
|
<span class="right-box-top-btn-txt">{{$t('overall.delete')}}</span>
|
||||||
<!--</button>-->
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<!-- end--顶部按钮-->
|
<!-- end--顶部按钮-->
|
||||||
|
|
||||||
@@ -155,10 +155,16 @@
|
|||||||
watch:{
|
watch:{
|
||||||
nodeData:{
|
nodeData:{
|
||||||
handler(n){
|
handler(n){
|
||||||
for(let key in this.form){
|
|
||||||
this.form[key]=n[key]
|
|
||||||
}
|
|
||||||
this.form.moduleId=n.id;
|
this.form.moduleId=n.id;
|
||||||
|
if( n.expressions){
|
||||||
|
n.expressions.forEach((item,index)=>{
|
||||||
|
this.addExpression();
|
||||||
|
this.name[index]=item.name;
|
||||||
|
this.unit[index]=item.unit;
|
||||||
|
this.expressions[index]=item.metric;
|
||||||
|
this.legends[index]=item.legend;
|
||||||
|
})
|
||||||
|
}
|
||||||
},
|
},
|
||||||
immediate: true,
|
immediate: true,
|
||||||
deep: true,
|
deep: true,
|
||||||
@@ -212,7 +218,12 @@
|
|||||||
},
|
},
|
||||||
mounted(){
|
mounted(){
|
||||||
// this.addExpression();
|
// this.addExpression();
|
||||||
this.addNodeInit()
|
this.addNodeInit();
|
||||||
|
if( this.nodeData.expressions){
|
||||||
|
this.nodeData.expressions.forEach((item,index)=>{
|
||||||
|
this.$refs['promql-'+(index)][0].metricChange(this.expressions[index]);
|
||||||
|
})
|
||||||
|
}
|
||||||
},
|
},
|
||||||
methods:{
|
methods:{
|
||||||
addNodeInit(selImageId){
|
addNodeInit(selImageId){
|
||||||
@@ -228,8 +239,8 @@
|
|||||||
setTimeout(()=>{
|
setTimeout(()=>{
|
||||||
this.iconArray=[...this.iconArray];
|
this.iconArray=[...this.iconArray];
|
||||||
this.imgageLoading=false;
|
this.imgageLoading=false;
|
||||||
if(selImageId){
|
if(selImageId || this.nodeData.iconId){
|
||||||
this.form.iconId=selImageId;
|
this.form.iconId=selImageId || this.nodeData.iconId;
|
||||||
}
|
}
|
||||||
},100)
|
},100)
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -4,12 +4,12 @@
|
|||||||
<span v-show="!selectNodeTitle&&editVisNetwork" class="edit-topology-module">
|
<span v-show="!selectNodeTitle&&editVisNetwork" class="edit-topology-module">
|
||||||
Module element :
|
Module element :
|
||||||
<span class="edit-topology-add" @click="addModelShow">Add</span>
|
<span class="edit-topology-add" @click="addModelShow">Add</span>
|
||||||
<span class="edit-topology-remove" @click="nodeDel">Remove</span>
|
<!--<span class="edit-topology-remove" @click="nodeDel">Remove</span>-->
|
||||||
</span>
|
</span>
|
||||||
<span v-show="!selectNodeTitle&&editVisNetwork" class="edit-topologyLine">
|
<span v-show="!selectNodeTitle&&editVisNetwork" class="edit-topologyLine">
|
||||||
Line :
|
Line :
|
||||||
<span class="edit-topology-add" @click="addLineTitleShow">Add</span>
|
<span class="edit-topology-add" @click="addLineTitleShow">Add</span>
|
||||||
<span class="edit-topology-remove" @click="lineDel">Remove</span>
|
<!--<span class="edit-topology-remove" @click="lineDel">Remove</span>-->
|
||||||
</span>
|
</span>
|
||||||
<span v-show="!selectNodeTitle&&editVisNetwork" class="edit-topologyLine">
|
<span v-show="!selectNodeTitle&&editVisNetwork" class="edit-topologyLine">
|
||||||
<el-button @click="saveTopology" class="saveTopology">save</el-button>
|
<el-button @click="saveTopology" class="saveTopology">save</el-button>
|
||||||
@@ -284,6 +284,7 @@
|
|||||||
type: 'error'
|
type: 'error'
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
// this.$put('/project/topo',{topo:'{}',projectId:this.allModuleInfo.basic.id});
|
||||||
this.$emit('editVisNetworkChange',false);
|
this.$emit('editVisNetworkChange',false);
|
||||||
},
|
},
|
||||||
cancelTopology(){
|
cancelTopology(){
|
||||||
@@ -353,7 +354,7 @@
|
|||||||
edges: {
|
edges: {
|
||||||
width: 2,
|
width: 2,
|
||||||
smooth:{ //设置两个节点之前的连线的状态
|
smooth:{ //设置两个节点之前的连线的状态
|
||||||
enabled: true,//默认是true,设置为false之后,两个节点之前的连线始终为直线,不会出现贝塞尔曲线
|
enabled: false,//默认是true,设置为false之后,两个节点之前的连线始终为直线,不会出现贝塞尔曲线
|
||||||
roundness:0.5,
|
roundness:0.5,
|
||||||
type: "curvedCW",
|
type: "curvedCW",
|
||||||
},
|
},
|
||||||
@@ -456,6 +457,7 @@
|
|||||||
x:'',
|
x:'',
|
||||||
y:'',
|
y:'',
|
||||||
image:'',
|
image:'',
|
||||||
|
id:'',
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
addLine(edges){ // 添加或者編輯line
|
addLine(edges){ // 添加或者編輯line
|
||||||
@@ -658,7 +660,7 @@
|
|||||||
this_.network.selectNodes(this_.NodeArr,true);
|
this_.network.selectNodes(this_.NodeArr,true);
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
if(this_.NodeArr.length===0){
|
if(this_.NodeArr.length===0&&this_.editVisNetwork){
|
||||||
this_.nodeEdit();
|
this_.nodeEdit();
|
||||||
}
|
}
|
||||||
this_.setPopPosition(selId,params);
|
this_.setPopPosition(selId,params);
|
||||||
@@ -677,7 +679,6 @@
|
|||||||
}
|
}
|
||||||
if(this_.editVisNetwork){
|
if(this_.editVisNetwork){
|
||||||
this_.lineData.color=this_.lineData.color.color?this_.lineData.color.color:this_.lineData.color;
|
this_.lineData.color=this_.lineData.color.color?this_.lineData.color.color:this_.lineData.color;
|
||||||
console.log(this_.lineData);
|
|
||||||
this_.addLineShow=true;
|
this_.addLineShow=true;
|
||||||
this_.isLineAdd=false;
|
this_.isLineAdd=false;
|
||||||
}
|
}
|
||||||
@@ -895,7 +896,7 @@
|
|||||||
margin-left: 30px;
|
margin-left: 30px;
|
||||||
}
|
}
|
||||||
.edit-topologyLine{
|
.edit-topologyLine{
|
||||||
margin-left: 130px;
|
margin-left: 60px;
|
||||||
}
|
}
|
||||||
.edit-topology-add,.edit-topology-remove,.edit-topologyCancel{
|
.edit-topology-add,.edit-topology-remove,.edit-topologyCancel{
|
||||||
color: #1989fa;
|
color: #1989fa;
|
||||||
|
|||||||
@@ -198,7 +198,7 @@
|
|||||||
this.topologyLoading=true;
|
this.topologyLoading=true;
|
||||||
this.editVisNetwork=false;
|
this.editVisNetwork=false;
|
||||||
this.$get('/project/topo',{projectId:n.id}).then(res=>{
|
this.$get('/project/topo',{projectId:n.id}).then(res=>{
|
||||||
if(res.data.topo&&res.data.topo.nodes.length>0){
|
if(res.data.topo&&res.data.topo.nodes&&res.data.topo.nodes.length>0){
|
||||||
this.nodesArray=[];
|
this.nodesArray=[];
|
||||||
this.edgesArray=[];
|
this.edgesArray=[];
|
||||||
this.nodesArrayOther=this.formatNodesArr(res.data.topo.nodes);
|
this.nodesArrayOther=this.formatNodesArr(res.data.topo.nodes);
|
||||||
@@ -221,7 +221,7 @@
|
|||||||
this.topologyLoading=true;
|
this.topologyLoading=true;
|
||||||
this.editVisNetwork=false;
|
this.editVisNetwork=false;
|
||||||
this.$get('/project/topo',{projectId:this.projectInfo.id}).then(res=>{
|
this.$get('/project/topo',{projectId:this.projectInfo.id}).then(res=>{
|
||||||
if(res.data.topo&&res.data.topo.nodes.length>0){
|
if(res.data.topo&&res.data.topo.nodes&&res.data.topo.nodes.length>0){
|
||||||
this.nodesArray=[];
|
this.nodesArray=[];
|
||||||
this.edgesArray=[];
|
this.edgesArray=[];
|
||||||
this.nodesArrayOther=this.formatNodesArr(res.data.topo.nodes);
|
this.nodesArrayOther=this.formatNodesArr(res.data.topo.nodes);
|
||||||
|
|||||||
Reference in New Issue
Block a user