monitor_v3 / hg-monitor-web · Commits

Go to a project

Authored by 王涛
Commit 086e2c1e6b870f8a2e98e351368114475180e639 2 parents 0d92cd9f 34226d46

Merge branch 'master-v32-lushangqing' into 'master' 

故障接口联调



See merge request !223
Inline Side-by-side
Showing 5 changed files with 147 additions and 22 deletions
@@ -41,7 +41,7 @@ @@ -41,7 +41,7 @@
41 <template #default="{row,prop,column}"> 41 <template #default="{row,prop,column}">
42 <div v-if="prop == 'kpiName'" class="list-data"> 42 <div v-if="prop == 'kpiName'" class="list-data">
43 <span class="list-data-text">指标: {{row.kpiName }}</span> 43 <span class="list-data-text">指标: {{row.kpiName }}</span>
44 - <img :id="row.index" @click="deleteItem(row.id, row)" src="./src/assets/images/faultDiagnosis/icon-item-delete.png" class="img-delete cursorClass"> 44 + <img :id="row.index" @click="deleteItem(row)" src="./src/assets/images/faultDiagnosis/icon-item-delete.png" class="img-delete cursorClass">
45 45
46 </div> 46 </div>
47 </template> 47 </template>
@@ -185,12 +185,21 @@ export default { @@ -185,12 +185,21 @@ export default {
185 this.$emit('callbackLog', 'log'); 185 this.$emit('callbackLog', 'log');
186 }, 186 },
187 //删除表格指标 187 //删除表格指标
188 - deleteItem(id, list){ 188 + deleteItem(item){
  189 + let that=this;
189 let params={ 190 let params={
190 - id:id,  
191 - list:list 191 + id:item.id
  192 + }
  193 + this.$http.get('/api-web/fault/conf/base/deleteById',params,function (res){
  194 + if(res){
  195 + that.$global.showMsg('删除成功');
  196 + that.getEnvironmentData();
  197 +
192 } 198 }
193 - this.$emit('callbackDelete',params) 199 + that.$emit('callbackDelete',item)
  200 +
  201 + })
  202 +
194 }, 203 },
195 //获取基础环境资源列表数据 204 //获取基础环境资源列表数据
196 getEnvironmentData(){ 205 getEnvironmentData(){
@@ -166,10 +166,10 @@ @@ -166,10 +166,10 @@
166 <div class="btn-el-btn margin-bottom-10" v-for="(item, index) in networkMonitorList" :key="index"> 166 <div class="btn-el-btn margin-bottom-10" v-for="(item, index) in networkMonitorList" :key="index">
167 <div> 167 <div>
168 <el-button class="multiple-choice-button" type="primary">{{item.linkName}}</el-button> 168 <el-button class="multiple-choice-button" type="primary">{{item.linkName}}</el-button>
169 - <img :id="item.id" @click="deleteItem(item.id, networkMonitorList)" src="./src/assets/images/faultDiagnosis/icon-item-delete.png" class="multiple-choice-icon cursorClass"> 169 + <img :id="item.id" @click="deleteNetLink(item)" src="./src/assets/images/faultDiagnosis/icon-item-delete.png" class="multiple-choice-icon cursorClass">
170 </div> 170 </div>
171 </div> 171 </div>
172 - <div class="flex-div btn-el-btn margin-bottom-10" > 172 + <div class="flex-div btn-el-btn margin-bottom-10" v-if="faultStateRadio==1">
173 <el-button class="multiple-choice-button color-999" @click="addNetNode">添加网络检测</el-button> 173 <el-button class="multiple-choice-button color-999" @click="addNetNode">添加网络检测</el-button>
174 <img src="./src/assets/images/faultDiagnosis/icon-item-add.png" class="multiple-choice-add-icon"> 174 <img src="./src/assets/images/faultDiagnosis/icon-item-add.png" class="multiple-choice-add-icon">
175 </div> 175 </div>
@@ -208,7 +208,7 @@ @@ -208,7 +208,7 @@
208 </div> 208 </div>
209 209
210 </div> 210 </div>
211 - <div class="flex-div btn-el-btn margin-bottom-10"> 211 + <div class="flex-div btn-el-btn margin-bottom-10" v-if="faultApplicationRadio==1">
212 <el-button class="multiple-choice-button color-999" @click="addApplicationMonitor()">添加应用检测</el-button> 212 <el-button class="multiple-choice-button color-999" @click="addApplicationMonitor()">添加应用检测</el-button>
213 <img src="./src/assets/images/faultDiagnosis/icon-item-add.png" class="multiple-choice-add-icon"> 213 <img src="./src/assets/images/faultDiagnosis/icon-item-add.png" class="multiple-choice-add-icon">
214 </div> 214 </div>
@@ -236,7 +236,7 @@ @@ -236,7 +236,7 @@
236 </div> 236 </div>
237 </el-col> 237 </el-col>
238 </el-row> 238 </el-row>
239 - <BasicEnvironment :propsData="propsData" @callbackDelete="deleteEnvironment"></BasicEnvironment> 239 + <BasicEnvironment v-if="faultEnvironmentRadio==1" :propsData="propsData" @callbackDelete="deleteEnvironment"></BasicEnvironment>
240 240
241 <!-- <el-row> 241 <!-- <el-row>
242 <el-col :span="24"> 242 <el-col :span="24">
@@ -318,11 +318,11 @@ @@ -318,11 +318,11 @@
318 <div class="context-multiple-choice flex-div-start margin-30 flex-div-wrap overflow-scroll-y"> 318 <div class="context-multiple-choice flex-div-start margin-30 flex-div-wrap overflow-scroll-y">
319 <div class="btn-el-btn margin-bottom-10" v-for="(item, index) in apmMonitorList" :key="index" > 319 <div class="btn-el-btn margin-bottom-10" v-for="(item, index) in apmMonitorList" :key="index" >
320 <el-button class="multiple-choice-button" type="primary">{{item.resName}}</el-button> 320 <el-button class="multiple-choice-button" type="primary">{{item.resName}}</el-button>
321 - <img :id="item.id" @click="deleteItem(item.id, apmMonitorList)" src="./src/assets/images/faultDiagnosis/icon-item-delete.png" class="multiple-choice-icon position-absolute cursorClass"> 321 + <img :id="item.id" @click="deleteApm(item)" src="./src/assets/images/faultDiagnosis/icon-item-delete.png" class="multiple-choice-icon position-absolute cursorClass">
322 322
323 </div> 323 </div>
324 324
325 - <div class="btn-el-btn margin-bottom-10"> 325 + <div class="btn-el-btn margin-bottom-10" v-if="faultAPMRadio==1">
326 <el-button class="multiple-choice-button" @click="addAPM()">添加 APM</el-button> 326 <el-button class="multiple-choice-button" @click="addAPM()">添加 APM</el-button>
327 <img src="./src/assets/images/faultDiagnosis/icon-item-add.png" class="multiple-choice-add-icon"> 327 <img src="./src/assets/images/faultDiagnosis/icon-item-add.png" class="multiple-choice-add-icon">
328 </div> 328 </div>
@@ -362,7 +362,7 @@ @@ -362,7 +362,7 @@
362 <img :id="item.id" @click="deleteItem(item.id, logDetectionList)" src="./src/assets/images/faultDiagnosis/icon-item-delete.png" class="multiple-choice-icon"> 362 <img :id="item.id" @click="deleteItem(item.id, logDetectionList)" src="./src/assets/images/faultDiagnosis/icon-item-delete.png" class="multiple-choice-icon">
363 </div> 363 </div>
364 </div> 364 </div>
365 - <div class="btn-el-btn margin-bottom-10"> 365 + <div class="btn-el-btn margin-bottom-10" v-if="faultLogRadio==1">
366 <el-button class="multiple-choice-button" @click="addLogMonitor()">添加日志检测</el-button> 366 <el-button class="multiple-choice-button" @click="addLogMonitor()">添加日志检测</el-button>
367 <img src="./src/assets/images/faultDiagnosis/icon-item-add.png" class="multiple-choice-add-icon"> 367 <img src="./src/assets/images/faultDiagnosis/icon-item-add.png" class="multiple-choice-add-icon">
368 </div> 368 </div>
@@ -402,7 +402,7 @@ @@ -402,7 +402,7 @@
402 <!--取消和保存--> 402 <!--取消和保存-->
403 <div class="btn-faultDiagnosis flex-center"> 403 <div class="btn-faultDiagnosis flex-center">
404 <el-button @click="goBackIndex">取消</el-button> 404 <el-button @click="goBackIndex">取消</el-button>
405 - <el-button @click="saveConfigDetail" type="primary">保存</el-button> 405 + <el-button @click="saveConfigDetail" type="primary" :loading="isLoading">保存</el-button>
406 406
407 </div> 407 </div>
408 408
@@ -132,12 +132,14 @@ export default { @@ -132,12 +132,14 @@ export default {
132 } 132 }
133 }, 133 },
134 setup(props){ 134 setup(props){
  135 + //btn加载中
  136 + let isLoading=Vue.ref(false);
135 //所属业务id 137 //所属业务id
136 let busTypeArr = props.detailData?props.detailData.bizId:Vue.ref(); 138 let busTypeArr = props.detailData?props.detailData.bizId:Vue.ref();
137 //诊断文档id 139 //诊断文档id
138 let docId= props.detailData?props.detailData.id:Vue.ref(); 140 let docId= props.detailData?props.detailData.id:Vue.ref();
139 //faultConfId 故障配置id 141 //faultConfId 故障配置id
140 - let faultConfId=props.detailData?props.detailData.faultConfId:Vue.ref(); 142 + let faultConfId=docId?docId:Vue.ref();
141 //模块id--网络监测，应用监测... 143 //模块id--网络监测，应用监测...
142 let targetId=Vue.ref(); 144 let targetId=Vue.ref();
143 let propsData=Vue.ref();//向子组件传值所属业务id 145 let propsData=Vue.ref();//向子组件传值所属业务id
@@ -197,6 +199,7 @@ export default { @@ -197,6 +199,7 @@ export default {
197 {type:'report',targetId:''}, 199 {type:'report',targetId:''},
198 ] 200 ]
199 return{ 201 return{
  202 + isLoading,
200 modelData, 203 modelData,
201 faultDefinitionRadio, 204 faultDefinitionRadio,
202 faultStateRadio, 205 faultStateRadio,
@@ -423,7 +426,14 @@ export default { @@ -423,7 +426,14 @@ export default {
423 this.configData.map((item,index)=>{ 426 this.configData.map((item,index)=>{
424 if(item.type==typeVal){ 427 if(item.type==typeVal){
425 // that.targetId=item.targetId; 428 // that.targetId=item.targetId;
  429 +
  430 + if(that.docId){
426 that.setTargetId(item.targetId); 431 that.setTargetId(item.targetId);
  432 + }else{
  433 + that.getTargetId(typeVal)
  434 + }
  435 + that.switchState(typeVal,item.state);
  436 +
427 that.faultConfId=item.faultConfId; 437 that.faultConfId=item.faultConfId;
428 438
429 } 439 }
@@ -437,6 +447,37 @@ export default { @@ -437,6 +447,37 @@ export default {
437 faultConfId:this.faultConfId 447 faultConfId:this.faultConfId
438 } 448 }
439 }, 449 },
  450 + //设置state
  451 + switchState(typeVal,state){
  452 + console.log("state",typeVal,state)
  453 + switch (typeVal) {
  454 +
  455 + case "netlink":
  456 + //网络检测
  457 + this.faultStateRadio=state;
  458 + break;
  459 + case "npm":
  460 + //应用检测
  461 + this.faultApplicationRadio=state;
  462 + break;
  463 + case "base":
  464 + //基础环境
  465 + this.faultEnvironmentRadio=state;
  466 + break;
  467 + case "apm":
  468 + //APM
  469 + this.faultAPMRadio=state;
  470 + break;
  471 + case "log":
  472 + //日志检测
  473 + this.faultLogRadio=state;
  474 + break;
  475 + case "report":
  476 + //订阅人员
  477 + break;
  478 +
  479 + }
  480 + },
440 481
441 //给弹框传值分类型 482 //给弹框传值分类型
442 postPropsData(typeVal,index){ 483 postPropsData(typeVal,index){
@@ -444,6 +485,7 @@ export default { @@ -444,6 +485,7 @@ export default {
444 this.switchModelDialog(typeVal,index) 485 this.switchModelDialog(typeVal,index)
445 486
446 this.setDetailConfig(typeVal); 487 this.setDetailConfig(typeVal);
  488 + // this.getTargetId(typeVal)
447 }else{ 489 }else{
448 this.$global.showMsg('请选择所属业务','warning') 490 this.$global.showMsg('请选择所属业务','warning')
449 } 491 }
@@ -514,6 +556,7 @@ export default { @@ -514,6 +556,7 @@ export default {
514 // this.APMVisible=true; 556 // this.APMVisible=true;
515 this.postPropsData('apm') 557 this.postPropsData('apm')
516 558
  559 +
517 }, 560 },
518 //关闭APM弹框 561 //关闭APM弹框
519 getAPMList(itemData){ 562 getAPMList(itemData){
@@ -536,6 +579,8 @@ export default { @@ -536,6 +579,8 @@ export default {
536 if(res && res.data){ 579 if(res && res.data){
537 that.apmMonitorList=res.data;//.slice(0,3); 580 that.apmMonitorList=res.data;//.slice(0,3);
538 581
  582 + }else{
  583 + that.apmMonitorList=[];
539 } 584 }
540 }) 585 })
541 }, 586 },
@@ -561,7 +606,7 @@ export default { @@ -561,7 +606,7 @@ export default {
561 }, 606 },
562 //基础环境指标删除回调函数 607 //基础环境指标删除回调函数
563 deleteEnvironment(obj){ 608 deleteEnvironment(obj){
564 - this.deleteItem(obj.id,obj.list) 609 + this.deleteItem(obj.id,obj)
565 }, 610 },
566 //根据诊断文档列表的id获取配置详情 611 //根据诊断文档列表的id获取配置详情
567 getDetailByid(){ 612 getDetailByid(){
@@ -571,7 +616,10 @@ export default { @@ -571,7 +616,10 @@ export default {
571 this.$http.get('/api-web/fault/conf/'+this.docId,params,function (res){ 616 this.$http.get('/api-web/fault/conf/'+this.docId,params,function (res){
572 if(res && res.object){ 617 if(res && res.object){
573 that.configData=res.object.confDetailList; 618 that.configData=res.object.confDetailList;
574 - that.faultConfId=that.configData[0].faultConfId; 619 + if(that.configData && that.configData.length>0){
  620 + that.faultConfId=res.object.id;
  621 + }
  622 +
575 that.name=res.object.name; 623 that.name=res.object.name;
576 624
577 } 625 }
@@ -646,6 +694,7 @@ export default { @@ -646,6 +694,7 @@ export default {
646 createBy:localStorage.getItem("lgn") 694 createBy:localStorage.getItem("lgn")
647 } 695 }
648 } 696 }
  697 + this.isLoading=true;
649 this.$http.post('/api-web/fault/conf/detail/saveConfigDetail',params,function (res){ 698 this.$http.post('/api-web/fault/conf/detail/saveConfigDetail',params,function (res){
650 if(res && res.success){ 699 if(res && res.success){
651 that.targetId=res.map.configDetail.targetId; 700 that.targetId=res.map.configDetail.targetId;
@@ -658,6 +707,7 @@ export default { @@ -658,6 +707,7 @@ export default {
658 that.$global.showMsg('保存失败','warning') 707 that.$global.showMsg('保存失败','warning')
659 708
660 } 709 }
  710 + that.isLoading=false;
661 711
662 }) 712 })
663 }, 713 },
@@ -736,6 +786,7 @@ export default { @@ -736,6 +786,7 @@ export default {
736 } 786 }
737 787
738 } 788 }
  789 + this.isLoading=true;
739 this.$http.post('/api-web/fault/conf/rule/saveOrUpdate',params,function (res){ 790 this.$http.post('/api-web/fault/conf/rule/saveOrUpdate',params,function (res){
740 if(res && res.success){ 791 if(res && res.success){
741 that.targetId=res.map.bFaultRule.targetId; 792 that.targetId=res.map.bFaultRule.targetId;
@@ -746,8 +797,28 @@ export default { @@ -746,8 +797,28 @@ export default {
746 that.$global.showMsg('保存失败','warning') 797 that.$global.showMsg('保存失败','warning')
747 798
748 } 799 }
  800 + that.isLoading=false;
  801 +
  802 + })
  803 + },
  804 + //删除网络监测
  805 + deleteNetLink(item) {
  806 + let that=this;
  807 + this.$global.confirm("确认删除链路及节点吗？", function () {
  808 + let params={
  809 + id:item.id,
  810 + }
  811 + this.$http.get('/api-web/fault/conf/netLink/deleteNetLinkAndNodeById',params,function (res){
  812 + if(res){
  813 + that.$global.showMsg("删除成功！");
  814 + that.getNetLinkList();
  815 + }else{
  816 + that.$global.showMsg("删除失败！",'warning')
  817 + }
749 818
750 }) 819 })
  820 + })
  821 +
751 }, 822 },
752 //删除应用监测 823 //删除应用监测
753 deleteApp(item){ 824 deleteApp(item){
@@ -762,19 +833,62 @@ export default { @@ -762,19 +833,62 @@ export default {
762 } 833 }
763 }) 834 })
764 }, 835 },
  836 + //删除apm
  837 + deleteApm(item){
  838 +
  839 + let that=this;
  840 + let params={
  841 + id:item.id
  842 + }
  843 + this.$http.get('/api-web/fault/conf/apm/deleteById',params,function (res){
  844 + if(res){
  845 + that.$global.showMsg('删除成功');
  846 + that.getApmListInfo();
  847 + }
  848 + })
  849 + },
765 //更改业务选择 850 //更改业务选择
766 changeBUsType(val){ 851 changeBUsType(val){
767 - this.propsData={  
768 - bizId:this.busTypeArr, 852 + this.getBusList();
  853 + // this.propsData={
  854 + // bizId:this.busTypeArr,
  855 + //
  856 + // }
  857 + // if(this.type=='apm'){
  858 + // this.getApmListInfo();
  859 + //
  860 + // }
  861 + // if(this.type=='npm'){
  862 + // this.getAppList();
  863 + // }
  864 + },
  865 + //根据业务bizId判断故障诊断表是否存在所属业务
  866 + getBusList(){
769 867
  868 + let that=this;
  869 + let params={
  870 + bizId:this.busTypeArr
770 } 871 }
771 - if(this.type=='apm'){  
772 - this.getApmListInfo();  
773 872
  873 + this.$http.get('/api-web/fault/conf/isExistByBizId/'+this.busTypeArr, {},function (res){
  874 + if(res && res.success){
  875 +
  876 + }else{
  877 + that.$global.showMsg(res.msg,'warning');
  878 + that.busTypeArr=that.detailData?that.detailData.bizId:'';
774 } 879 }
775 - if(this.type=='npm'){  
776 - this.getAppList(); 880 + that.propsData={
  881 + bizId:that.busTypeArr,
  882 +
777 } 883 }
  884 + if(that.type=='apm'){
  885 + that.getApmListInfo();
  886 +
  887 + }
  888 + if(that.type=='npm'){
  889 + that.getAppList();
  890 + }
  891 + })
778 }, 892 },
779 //返回首页 893 //返回首页
780 goBackIndex(){ 894 goBackIndex(){
@@ -152,6 +152,7 @@ export default { @@ -152,6 +152,7 @@ export default {
152 if(proxy.networkMonitorList.length>0){ 152 if(proxy.networkMonitorList.length>0){
153 proxy.isClickNet=0; 153 proxy.isClickNet=0;
154 proxy.linkId=proxy.networkMonitorList[0].id; 154 proxy.linkId=proxy.networkMonitorList[0].id;
  155 + proxy.linkName=proxy.networkMonitorList[0].linkName;
155 } 156 }
156 proxy.getNodeData(); 157 proxy.getNodeData();
157 158
@@ -309,6 +310,7 @@ export default { @@ -309,6 +310,7 @@ export default {
309 this.isClickNet=index; 310 this.isClickNet=index;
310 this.addSetLIstVisible=false; 311 this.addSetLIstVisible=false;
311 this.linkId=item.id; 312 this.linkId=item.id;
  313 + this.linkName=item.linkName;
312 this.getNodeData(); 314 this.getNodeData();
313 315
314 }, 316 },