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

nezha-fronted/src/components/charts/chart-alert-list.vue

@@ -464,6 +464,9 @@ export default {
       })
     },
     messageDetail (row) {
+      if (row.alertRule.type == 3) {
+        return
+      }
       this.$get('/alert/rule/' + row.alertRule.id).then(res => {
         this.currentMsg = { ...row, alertRule: { ...res.data } }
         this.graphShow = true

nezha-fronted/src/components/common/detailView/detailViewTopSearch.vue

@@ -25,8 +25,9 @@
               <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top detail-top-search-dropdown">
                 <div style="text-align: center;"><el-input style="width: calc(100% - 40px)" size="small" v-model="searchStr" @input="(val)=>{searchStrChange(val,key)}"  suffix-icon="el-icon-search"/></div>
                  <el-checkbox-group v-model="selectValue[item.key]">
-                    <el-dropdown-item v-for="(item3,index3) in item.children" :key="index3" :title="item3.name">
+                    <el-dropdown-item v-for="(item3,index3) in item.children" :key="index3" :title="item3.name" class="nz-dropdown-menu__item-hover">
                       <el-checkbox :label="item3.id">{{item3.name}}</el-checkbox>
+                      <span class="right-box-select-num">{{item3.num}}</span>
                     </el-dropdown-item>
                  </el-checkbox-group>
               </el-dropdown-menu>
@@ -56,9 +57,12 @@
               <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top detail-top-search-dropdown">
                 <div style="text-align: center;"><el-input style="width: calc(100% - 40px)" size="small" v-model="searchStr" @input="(val)=>{searchStrChange(val,key)}"  suffix-icon="el-icon-search"/></div>
                  <el-checkbox-group v-model="selectValue[item.key]">
-                    <el-dropdown-item v-for="(item3,index3) in item.children" :key="index3" >
+                    <el-dropdown-item v-for="(item3,index3) in item.children" :key="index3" class="nz-dropdown-menu__item">
 <!--                      <span :title="item3.name" class="children-title-name"> {{item3.name}}</span>-->
-                      <el-checkbox :label="item3.id+'-'+item4.id" :key="index4"  v-for="(item4,index4) in item3.children" :title="item3.name+'/'+item4.name">{{item3.name+'/'+item4.name}}</el-checkbox>
+                     <div  v-for="(item4,index4) in item3.children" :key="index4" class="el-dropdown-menu__item nz-dropdown-menu__item-hover">
+                        <el-checkbox :label="item3.id+'-'+item4.id" :title="item3.name+'/'+item4.name">{{item3.name+'/'+item4.name}}</el-checkbox>
+                       <span class="right-box-select-num">{{item4.num}}</span>
+                     </div>
                     </el-dropdown-item>
                  </el-checkbox-group>
               </el-dropdown-menu>
@@ -88,9 +92,12 @@
               <el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top detail-top-search-dropdown">
                 <div style="text-align: center;"><el-input style="width: calc(100% - 40px)" size="small" v-model="searchStr" @input="(val)=>{searchStrChange(val,key)}"  suffix-icon="el-icon-search"/></div>
                  <el-checkbox-group v-model="selectValue[item.key]">
-                    <el-dropdown-item v-for="(item3,index3) in item.children" :key="index3" >
+                    <el-dropdown-item v-for="(item3,index3) in item.children" :key="index3" class="nz-dropdown-menu__item">
                       <span :title="item3.name" class="children-title-name"> {{item3.name}}</span>
-                      <el-checkbox :label="item3.id+'-'+item4.id" :key="index4"  v-for="(item4,index4) in item3.children" :title="item4.name" :a="item3.id+'-'+item4.id">{{item4.name}}</el-checkbox>
+                     <div :key="index4"  v-for="(item4,index4) in item3.children" class="el-dropdown-menu__item nz-dropdown-menu__item-hover">
+                        <el-checkbox :label="item3.id+'-'+item4.id" :title="item4.name" :a="item3.id+'-'+item4.id">{{item4.name}}</el-checkbox>
+                       <span class="right-box-select-num">{{item4.num}}</span>
+                     </div>
                     </el-dropdown-item>
                  </el-checkbox-group>
               </el-dropdown-menu>
@@ -260,15 +267,16 @@ export default {
       background: #fff !important;
       padding: 0;
       max-width: 200px;
-      overflow: hidden;
+      display: flex;
-      text-overflow:ellipsis;
-      white-space:nowrap;
       .el-checkbox{
-        width: calc(100% - 20px);
+        flex: 1;
         height: 36px;
         padding: 0 0 0 20px;
-        display: flex;
+        display: inline-flex;
         align-items: center;
+        overflow: hidden;
+        text-overflow:ellipsis;
+        white-space:nowrap;
         .el-checkbox__label{
           flex: 1;
           overflow: hidden;
@@ -276,10 +284,6 @@ export default {
           white-space: nowrap;
         }
       }
-      .el-checkbox:hover{
-        color: #fa901c;
-        background-color: #fafafa !important;
-      }
       .children-title-name{
         width: calc(100% - 20px);
         height: 36px;
@@ -287,12 +291,37 @@ export default {
         font-size: 12px;
         color: #909399;
         line-height: 30px;
+        display: inline-block;
       }
     }
+    .nz-dropdown-menu__item{
+      flex-direction: column;
+    }
     .el-dropdown-menu__item:not(.is-disabled):hover{
       color: #606266;
       background: #fff !important;
     }
+    .right-box-select-num {
+      display: inline-block;
+      width: 30px;
+      color: #999999;
+      text-align: right;
+      margin-right: 5px;
+    }
+    .nz-dropdown-menu__item-hover:not(.is-disabled):hover{
+      color: #fa901c;
+      background-color: #fafafa !important;
+      .el-checkbox{
+        color: #fa901c;
+      }
+    }
+    .nz-dropdown-menu__item-hover{
+      .el-checkbox.is-checked{
+        .el-checkbox__label{
+          color: #fa901c;
+        }
+      }
+    }
   }
   .clear-all-select{
     padding: 0 20px;

nezha-fronted/src/components/common/labelFilter/clickSearch.vue

@@ -6,7 +6,7 @@
         <template>
           <el-checkbox-group v-if="data.type === 'checkBox'" ref="searchContent" v-model="selectValue[data.key]" @change="selectValue.change === 0 && selectValue.change++">
             <template v-for="(item, j) in data.children">
-              <el-checkbox v-show="j < data.index || data.showMore" :key="j" :label="item.value" :title="item.key || item.name || item.label">{{item.key || item.name || item.label}}</el-checkbox>
+              <el-checkbox v-show="j < data.index || data.showMore" :key="j" :label="item.value" :title="item.key || item.name || item.label">{{item.key || item.name || item.label}} <span class="search-content-num">({{item.num}})</span></el-checkbox>
             </template>
           </el-checkbox-group>
         </template>
@@ -306,7 +306,7 @@ export default {
               this.$set(c, 'labelWidth', labelWidth) // label区域宽
               this.$set(c, 'inputWidth', this.widthConstant.dropdownCheckBox.inputOriginalWidth) // 内容区域宽
             } else if (this.titleSearchListCopy[type].type === 'checkBox') {
-              const width = this.computeDistance(c.name) + this.widthConstant.checkBox.tagBlankTotal + this.widthConstant.checkBox.boxMargin
+              const width = this.computeDistance(c.name + ' (' + c.num + ')') + this.widthConstant.checkBox.tagBlankTotal + this.widthConstant.checkBox.boxMargin
               this.$set(c, 'width', width) // 总宽
             }
           })
@@ -474,7 +474,7 @@ export default {
     line-height: 45px;
   }
   .el-checkbox{
-    line-height: 45px;
+    line-height: 40px;
   }
 }
 .more.search-items{
@@ -500,4 +500,7 @@ export default {
     font-size: 12px;
   }
 }
+  .search-content-num{
+    color: #999999;
+  }
 </style>

nezha-fronted/src/components/common/labelFilter/dropdown.vue

@@ -17,7 +17,12 @@
       @blur="$emit('blur', item, false, $event)"
       @change="change"
       @focus="$emit('focus', item, true, $event)"
-    ></el-cascader>
+    >
+      <template slot-scope="{ node, data }">
+        <span>{{ data.name }}</span>
+        <span class="search-content-num">({{data.num}})</span>
+      </template>
+    </el-cascader>
   </div>
 </template>
 

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

@@ -558,7 +558,7 @@ export default {
         })
       })
     },
-    getSearchableMetaData () {
+    getSearchableMetaData (metaData) {
       return new Promise(resolve => {
         this.$get('asset/field/meta', { pageSize: -1 }).then(response => {
           if (response.code === 200) {
@@ -571,7 +571,20 @@ export default {
               if (m.param) {
                 const param = JSON.parse(m.param)
                 if (param.items) {
-                  data.push({ ...m, children: param.items.map(p => { return { ...p, id: p.name, metaId: m.id } }) })
+                  // param.items.map(p => { return { ...p, id: p.name, metaId: m.id, num: metaData.find(meta => meta.id === m.id && meta.option === p.name).num } })
+                  data.push({
+                    ...m,
+                    children: param.items.map(p => {
+                      const metaFind = metaData.find(meta => meta.id === m.id && meta.option === p.name)
+                      return {
+                        ...p,
+                        id: p.name,
+                        name: p.name,
+                        metaId: m.id,
+                        num: metaFind ? metaFind.num : 0
+                      }
+                    })
+                  })
                 }
               }
             })
@@ -604,7 +617,7 @@ export default {
           // const titleSearchData = {}
           this.modelData.forEach(m => {
             m.value = []
-            arr.push({ ...m, name: m.brand.name + '/' + m.name, value: m.id })
+            arr.push({ ...m, name: m.brand.name + '/' + m.name, value: m.id, num: m.num })
             // if (titleSearchData[m.brand.name]) {
             //   titleSearchData[m.brand.name].children.push(m)
             // } else {