Merge branch 'codeCheck' of https://git.mesalab.cn/nezha/nezha-fronted into codeCheck

nezha-fronted/src/components/common/header.vue

@@ -203,7 +203,7 @@
           assetId: ''
         },
         alertRule: {
-          id: '',
+          id: null,
           alertName: '',
           type: '',
           linkObject: {id: '', name: ''},

nezha-fronted/src/components/common/rightBox/alertConfigBox.vue

@@ -1,8 +1,8 @@
 <template>
-  <div class="right-box right-box-alert-config" v-clickoutside="clickOutside">
+  <div class="right-box right-box-alert-config" v-clickoutside="clickOutside" v-if="rightBox.show">
     <!-- begin--顶部按钮-->
     <div class="right-box-top-btns">
-      <button type="button" v-if="alertRule.id" id="alert-box-del" @click="del" class="nz-btn nz-btn-size-normal nz-btn-size-alien nz-btn-style-light">
+      <button type="button" v-if="editAlertRule&&editAlertRule.id" id="alert-box-del" @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-txt">{{$t('overall.delete')}}</span>
       </button>
@@ -121,6 +121,9 @@
     },
     data() {
       return {
+        rightBox:{
+          show:false
+        },
         promqlCount: 1,
         promqlKeys: [0],
         expressions: [''],
@@ -214,11 +217,16 @@
       }
     },
     methods: {
+      show:function(){
+        this.rightBox.show=true;
+      },
       clickOutside() {
         this.esc(false);
+        this.rightBox.show=false;
       },
       esc(refresh) {
         this.$emit("close", refresh);
+        this.rightBox.show=false;
       },
       save() {
         this.editAlertRule.expr = this.expressions[0];
@@ -279,11 +287,10 @@
     watch: {
       alertRule: {
         deep: true,
-        immediate: true,
         handler(n, o) {
           console.info(n)
           this.editAlertRule = JSON.parse(JSON.stringify(n));
-          if (this.editAlertRule.id) {
+          if (this.editAlertRule&&this.editAlertRule.id) {
             this.expressions = [this.editAlertRule.expr];
             this.$nextTick(() => {
               this.expressions.forEach((ex, index) => {

nezha-fronted/src/components/page/alert/config.vue

@@ -103,7 +103,7 @@
     </div>
     </left-menu>
     <transition name="right-box">
-      <alert-config-box v-if="rightBox.show" :alert-rule="alertRule" @close="closeRightBox" ref="alertConfigBox"></alert-config-box>
+      <alert-config-box  :alert-rule="alertRule" @close="closeRightBox" ref="alertConfigBox"></alert-config-box>
     </transition>
     <element-set
       v-if="tools.showElementSet"
@@ -124,10 +124,6 @@
     name: "alert-config",
     data() {
       return {
-        //侧滑
-        rightBox: {
-          show: false,
-        },
         /*二级页面相关*/
         bottomBox: {
           ruleDetail: {},
@@ -333,10 +329,9 @@
       },
       edit(u) {
         this.alertRule = JSON.parse(JSON.stringify(u));
-        this.rightBox.show = true;
+        this.$refs.alertConfigBox.show();
       },
       closeRightBox(refresh) {
-        this.rightBox.show = false;
         if (refresh) {
           this.getTableData();
         }
@@ -367,7 +362,7 @@
       },
       add() {
         this.alertRule = this.newAlertRule();
-        this.rightBox.show = true;
+        this.$refs.alertConfigBox.show();
       },
       newAlertRule() {
         return JSON.parse(JSON.stringify(this.blankAlertRule));

nezha-fronted/src/components/page/asset/asset.vue

@@ -54,14 +54,11 @@
               </el-collapse-item>
               <el-collapse-item name="ping" :title="$t('asset.left.ping')">
                 <el-checkbox-group v-model="pingCheckList" size="small" @change="changePingCheckBox">
-                  <el-checkbox class="sidebar-info-item" :class="{'sidebar-info-item-active': indOf(pingCheckList, item.key)}" v-for="(item, index) in pingData" :key="index" :label="item.value">
+                  <el-checkbox class="sidebar-info-item" :class="{'sidebar-info-item-active': indOf(pingCheckList, item.key)}" v-for="(item, index) in pingData" :key="index" :label="item.label">
                     <div class="sidebar-info-item-txt">
-                      <el-popover v-if="item.value.length > 16" trigger="hover" placement="top-start" :content="item.value" >
+                      <span>{{item.label}}</span>
-                        <span slot="reference">{{item.value}}</span>
-                      </el-popover>
-                      <span v-else>{{item.value}}</span>
                     </div>
-                    <el-tooltip :content="''+item.total" placement="top" effect="light" :disabled="item.total<99">
+                    <el-tooltip :content="''+item.total" placement="top" effect="light" :disabled="item.total < 99">
                       <el-badge class="mark" :value="item.total" :max="99"/>
                     </el-tooltip>
                   </el-checkbox>
@@ -428,7 +425,7 @@
         assetTypeCheckList: [],
         vendorData: [],
         vendorCheckList: [],
-        pingData: this.$CONSTANTS.asset.pingData,
+        pingData: [],
         pingCheckList: [],
 
         pageObj: {
@@ -661,41 +658,6 @@
           })
         });
       },
-      addNewData(type) {
-        if (type === 'IDC') {
-          this.$post('idc', this.addIdcData).then(res => {
-            if (res.code === 200) {
-              const h = this.$createElement;
-              this.$message({duration: 2000, type: 'success', message: this.$t("tip.saveSuccess")});
-              this.getDcData()
-              this.getTableData()
-              /*this.getLeftMenuList()
-              this.getAssetData()*/
-            } else {
-              this.$message.error(res.msg);
-            }
-          })
-        }
-      },
-      deleteData(data, item) {
-        this.$confirm(this.$t("tip.assetConfirmDelete"), {
-          confirmButtonText: this.$t("tip.yes"),
-          cancelButtonText: this.$t("tip.no"),
-          type: 'warning'
-        }).then(() => {
-          this.$delete(data + "?ids=" + item).then(response => {
-            if (response.code === 200) {
-              this.$message({duration: 2000, type: 'success', message: this.$t("tip.deleteSuccess")});
-              this.getTableData();
-              this.getDcData();
-              /*this.getAssetData();
-              this.getLeftMenuList();*/
-            } else {
-              this.$message.error(response.msg);
-            }
-          })
-        });
-      },
       markOptionData(data) {
         data.forEach(item => {
           this.$set(item, 'isEdit', false);
@@ -705,26 +667,6 @@
           this.$set(item, item.id + item.name, false)
         })
       },
-      editOptionData(item) {
-        if (!item.isEdit) {
-          item.isEdit = true;
-        } else {
-          if (item.name !== item.oldName) {
-            item.isEdit = false;
-          } else {
-            item.isEdit = false;
-          }
-        }
-      },
-      delOptionData(data) {
-      },
-      tabControl(data) {
-        if (data === 'close') {
-          this.editUnitShow = false;
-          this.$refs['assetEditUnit'].tabView = false;
-          this.rightBox.show = false;
-        }
-      },
       indOf(a, b) {
         let c = [];
         for (let i = 0; i < a.length; i++) {
@@ -920,38 +862,37 @@
       /*}
         this.getAssetData();*/
       },
-      /*// 获取左侧菜单数据
+      // 获取左侧菜单数据
       getLeftMenuList(){
-        this.$get('asset/filter').then(response => {
+        return new Promise(resolve => {
-          if (response.code === 200) {
+          this.$get('asset/filter').then(response => {
-            //dc
+            if (response.code === 200) {
-            this.checkListData = this.IDCOptionData = response.data.dc;
+              //dc
-            this.markOptionData(this.IDCOptionData);
+              this.dcData = response.data.dc;
-            // AssetType
+              // AssetType
-            this.assetTypeCheckListData = response.data.assetType;
+              this.assetTypeData = response.data.assetType;
-            // vendor
+              // vendor
-            this.vendorCheckListData = response.data.vendor;
+              this.vendorData = response.data.vendor;
-            // ping
+              // ping
-            this.pingCheckListData= response.data.ping.map(item=>{
+              this.pingData = response.data.ping.map(item => {
-              item.label=item.name;
+                item.label = item.name;
-              item.value=item.status;
+                item.value = item.status;
-              return item
+                return item;
-            })
+              });
-          }
+            }
-        })
+            resolve();
-      },*/
+          });
-    },
+        });
-    created() {
+      },
-      this.getUserData();
-      this.flushData();
-      this.getPingData();
     },
     mounted() {
       //初始化数据
-      Promise.all([this.getVendorData(), this.getAssetTypeData(), this.getUserData(), this.getDcData()]).then(response => {
+      /*Promise.all([this.getVendorData(), this.getAssetTypeData(), this.getUserData(), this.getDcData()]).then(response => {
+        this.getTableData();
+      });*/
+      this.getLeftMenuList().then(() => {
         this.getTableData();
       });
-      // this.getLeftMenuList()//获取左侧菜单列表
       //是否存在分页缓存
       let pageSize = localStorage.getItem('nz-pageSize-' + localStorage.getItem('nz-username') + '-' + this.tableId);
       if (pageSize != 'undefined' && pageSize != null) {

nezha-fronted/src/components/page/config/mibBrowser.vue

@@ -18,6 +18,7 @@
             size="mini"
             value-key="host"
             style="width: 100%;"
+            @input="assetChange"
           >
             <template slot-scope="{ item }">
               <div>{{ item.host }}</div>
@@ -83,7 +84,7 @@
                     <div class="mib-browser-ad-search-label">{{$t('login.password')}}</div>
                   </el-col>
                   <el-col :span="17">
-                    <el-input class="input-x-mini-24" v-model.trim="searchParamPop.auth.password"></el-input>
+                    <el-input type="password" class="input-x-mini-24" v-model.trim="searchParamPop.auth.password"></el-input>
                   </el-col>
                 </el-row>
 
@@ -116,7 +117,7 @@
                     <div class="mib-browser-ad-search-label">{{$t('project.module.privPassword')}}</div>
                   </el-col>
                   <el-col :span="17">
-                    <el-input class="input-x-mini-24" v-model.trim="searchParamPop.auth.privPassword"></el-input>
+                    <el-input type="password" class="input-x-mini-24" v-model.trim="searchParamPop.auth.privPassword"></el-input>
                   </el-col>
                 </el-row>
               </template>
@@ -316,6 +317,7 @@
         assetData: [],
 
         typeData: ["OctetString", "Integer", "OID", "Gauge", "Counter32", "IpAddress", "TimeTicks", "Counter64", "UnsignedInteger", "BITS", "Float", "DateAndTime"],
+        assetInputTimer:null,
       }
     },
     computed: {
@@ -450,6 +452,55 @@
       clearResult() {
         this.resultData = [];
       },
+      resetSearchParam:function(){
+        this.searchParamPop={
+          host: '',
+            port: 161,
+            oid: '',
+            operation: 'get',
+            version: 2,
+            community: 'public',
+            auth: {
+            username: '',
+              password: '',
+              securityLevel: '',
+              authProtocol: '',
+              privProtocol: '',
+              privPassword: ''
+          }
+        }
+      },
+      assetChange:function(value){
+        clearTimeout(this.assetInputTimer)
+        this.assetInputTimer=setTimeout(()=>{
+          this.resetSearchParam();
+          let asset=this.assetData.find(item=>{
+            return item.host == value
+          })
+
+          if(asset&&asset.accounts&&asset.accounts.length>0){
+            let snmpAccount=asset.accounts.find(item=>{
+              return item.protocol == 'SNMP'
+            })
+
+            if(snmpAccount){
+              console.log(snmpAccount)
+              this.searchParamPop.port=snmpAccount.port;
+              this.searchParamPop.community=snmpAccount.params.community;
+              this.searchParamPop.version=snmpAccount.params.version;
+              if(this.searchParamPop.version == 3){
+                this.searchParamPop.auth.username=snmpAccount.params.user;
+                this.searchParamPop.auth.securityLevel=snmpAccount.params.securityLevel;
+                this.searchParamPop.auth.password=snmpAccount.params.password;
+                this.searchParamPop.auth.authProtocol=snmpAccount.params.authProtocol;
+                if(this.searchParamPop.auth.securityLevel=='authPriv')
+                this.searchParamPop.auth.privProtocol=snmpAccount.params.privProtocol;
+                this.searchParamPop.auth.privPassword=snmpAccount.params.privPassword;
+              }
+            }
+          }
+        },200)
+      },
       assetSuggestion(queryString, callback) {
         let data = [];
         if (!queryString) {