feat:promeServer 配置新增thanos 选项

nezha-fronted/src/components/common/js/constants.js

@@ -32,10 +32,56 @@ export const staticMenus = {
 };
 
 export const promServer = {
-  typeData: [
+  theData:[
-    {value: 1, label: 'Global'},
+    {
-    {value: 2, label: 'Per-Datacenter'}
+      label:'Federation',
-  ],
+      value:'federation',
+      children:[
+        {
+          label:'Global',
+          value:1,
+          text:'Global',
+        },
+        {
+          label:'Per-datacenter',
+          value:2,
+          text:'Per-datacenter',
+        }
+      ]
+    },
+    {
+      label:'Thanos',
+      value:'Thanos',
+      children:[
+        {
+          label:'query',
+          value:3,
+          text:'Thanos-query'
+        },
+        {
+          label:'rule',
+          value:4,
+          text:'Thanos-rule'
+        },
+        {
+          label:'sidecar',
+          value:5,
+          text:'Thanos-sidecar'
+        },
+        {
+          label:'store',
+          value:6,
+          text:'Thanos-store'
+        },
+        {
+          label:'compactor',
+          value:7,
+          text:'Thanos-compactor'
+        }
+      ]
+    }
+  ]
+
 };
 
 export const asset = {

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

@@ -39,9 +39,15 @@
         </el-form-item>
         <!--type-->
         <el-form-item :label="$t('config.promServer.type')" prop="type">
-          <el-select popper-class="config-dropdown" v-model="editPromServer.type" placeholder="" size="small">
+          <el-cascader
-            <el-option v-for="item in $CONSTANTS.promServer.typeData" :key="item.value" :label="item.label" :value="item.value" :id="'prom-edit-type-op-'+item.value"></el-option>
+            style="width: 100%"
-          </el-select>
+            v-model="editPromServer.type"
+            placeholder=""
+            size="small"
+            popper-class="config-dropdown"
+            :options="$CONSTANTS.promServer.theData"
+            :props="{ multiple: false, checkStrictly: false ,emitPath:false}"
+            clearable></el-cascader>
         </el-form-item>
       </el-form>
     </el-scrollbar>

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

@@ -44,8 +44,9 @@
             <span v-if="item.prop == 'idc'" >{{scope.row[item.prop]?scope.row[item.prop].name:'-'}}</span>
 
             <span v-else-if="item.prop == 'type'">
-                {{scope.row[item.prop] == '1' ? 'Global' : ''}}
+                <!--{{scope.row[item.prop] == '1' ? 'Global' : ''}}
-                {{scope.row[item.prop] == '2' ? 'Per-Datacenter' : ''}}
+                {{scope.row[item.prop] == '2' ? 'Per-Datacenter' : ''}}-->
+              {{findServerType(scope.row[item.prop]).text}}
             </span>
             <span v-else-if="item.prop == 'status'">
               <el-popover placement="right" width="200" trigger="hover" :content="$t('asset.assetStatPre')+(scope.row.checkTime?scope.row.checkTime:$t('asset.assetStatDown'))">
@@ -214,6 +215,7 @@
           }],
         },
         searchLabel: {}, //搜索参数
+        promServerType:null,
       }
     },
     methods: {
@@ -372,6 +374,17 @@
         this.$set(this.searchLabel, "orderBy", orderBy);
         this.getTableData();
       },
+      findServerType(type){
+        if(!this.promServerType){
+          this.promServerType=[];
+          this.$CONSTANTS.promServer.theData.forEach(item=>{
+            this.promServerType=this.promServerType.concat(item.children)
+          })
+        }
+        return this.promServerType.find(item=>{
+          return item.value == type
+        })
+      }
     },
     mounted() {
       //初始化数据