feat:调用保存接口的按钮

This commit is contained in:
zhangyu
2020-08-26 14:51:45 +08:00
parent 160c3e12f2
commit f935749e96
4 changed files with 60 additions and 27 deletions

View File

@@ -1,6 +1,6 @@
<template>
<div class="mc" @click.self="clickOutside">
<div class="right-box right-box-project-alert">
<!--<div class="mc" @click.self="clickOutside">-->
<div class="right-box right-box-project-alert" v-clickoutside="clickOutside">
<!-- begin--顶部按钮-->
<div class="right-box-top-btns">
<!--<button id="edit-ep-del" type="button" @click="del" class="nz-btn nz-btn-size-normal nz-btn-size-alien nz-btn-style-light ">-->
@@ -147,7 +147,7 @@
<Pagination :pageObj="pageObj" @pageNo='pageNo' @pageSize='pageSize' ref="Pagination"></Pagination>
</div>
</div>
</div>
<!--</div>-->
</template>
<script>

View File

@@ -133,11 +133,9 @@
this.projectInfo.loading=true;
this.$get('project/info', {id:n.id}).then(response => {
if (response.code === 200) {
this.projectInfo.loading=false;
this.projectInfo={...this.projectInfo,...response.data.basic,moduleMum:response.data.module.length};
this.allModuleInfo=response.data;
this.$nextTick(()=>{
this.projectInfo.loading=false;
})
}
});

View File

@@ -256,11 +256,44 @@
},
methods:{// 保存拓扑图数据
saveTopology(){
let nodes=[...this.nodesArray];
let edges=[...this.edgesArray];
console.log(nodes,edges);
let nodes=this.formatNodes([...this.nodesArray]);
let edges=this.formatEdges([...this.edgesArray]);
console.log(nodes,edges,this.nodesArray,this.edgesArray);
this.$put('/project/topo',{topo:JSON.stringify({nodes,edges}),projectId:this.allModuleInfo.basic.id});
this.$emit('editVisNetworkChange',false);
},
formatNodes(arr){
let arr1=[];
arr.forEach(item=>{
let obj={
"x": item.x,
"y": item.y,
"moduleId": item.moduleId,
"label":item.label,
"iconId": item.iconId,
"expressions": item.expressions
};
arr1.push(obj)
});
return arr1
},
formatEdges(arr){
let arr1=[];
arr.forEach(item=>{
let obj={
"name": item.lineName,
"width": item.width,
"arrows": item.arrows,
"color": item.color,
"source": item.from,
"target": item.to,
"smooth": item.smooth,
"expressions": item.expressions,
};
arr1.push(obj)
});
return arr1
},
//拓扑图方法
init(){
let this_ = this;

View File

@@ -139,27 +139,26 @@
alertData:{}
},
watch:{
allModuleInfo:{
immediate: true,
deep: true,
handler(n){
this.getNetworkData(n);
},
},
// allModuleInfo:{
// immediate: true,
// deep: true,
// handler(n){
// this.getNetworkData(n);
// },
// },
projectInfo:{
immediate: true,
deep: true,
handler(n){
this.getNetworkData(n);
},
},
alertData:{
immediate: true,
deep: true,
handler(n){
this.getNetworkData(n);
},
},
// alertData:{
// immediate: true,
// deep: true,
// handler(n){
// this.getNetworkData(n);
// },
// },
},
data () {
return {
@@ -184,13 +183,16 @@
},
getNetworkData(n){
this.topologyLoading=true;
// this.$get('/project/topo',{projectId:n.id}).then(res=>{
// console.log(res);
console.log(n);
this.$get('/project/topo',{projectId:n.id}).then(res=>{
console.log(res);
setTimeout(()=>{
this.topologyLoading=false;
this.nodesArray=[];
this.edgesArray=[];
this.$refs['topology'].setNetworkData( this.edgesArray,this.nodesArray);
},500)
// })
})
},
editVisNetworkChange(flag){
this.editVisNetwork=flag;