perf:alertMessage label增加排序 & 部分国际化补充、更正

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

@@ -100,11 +100,11 @@
                 <span v-if="scope.row[item.prop] == 'low'"><i class="el-icon-arrow-down"></i>&nbsp;{{severityData[2].value}}</span>
               </span>
                 <template v-else-if="item.prop == 'labels'">
-                  <nz-alert-tag :label="key" :type="tagType(key)" style="margin: 5px;"
+                  <nz-alert-tag :label="item.label" :type="tagType(item.label)" style="margin: 5px;"
-                                :cursor-point="tagType(key) == 'info' ? false : true"
+                                :cursor-point="tagType(item.label) == 'info' ? false : true"
-                                :key="key"
+                                :key="item.label"
-                                v-if="key != 'alertname' && key != 'severity'"
+                                v-if="item.label != 'alertname' && item.label != 'severity'"
-                                v-for="(value, key) in scope.row.labels">{{value}}</nz-alert-tag>
+                                v-for="item in labelsSort(scope.row.labels)">{{item.value}}</nz-alert-tag>
                 </template>
                 <div v-else-if="item.prop == 'state'">
                 <span class="">
@@ -203,11 +203,11 @@
               <span v-if="scope.row[item.prop] == 'low'"><i class="el-icon-arrow-down"></i>&nbsp;{{severityData[2].value}}</span>
             </span>
                 <template v-else-if="item.prop == 'labels'">
-                  <nz-alert-tag :label="key" :type="tagType(key)" style="margin: 5px;"
+                  <nz-alert-tag :label="item.label" :type="tagType(item.label)" style="margin: 5px;"
-                                :cursor-point="tagType(key) == 'info' ? false : true"
+                                :cursor-point="tagType(item.label) == 'info' ? false : true"
-                                :key="key"
+                                :key="item.label"
-                                v-if="key != 'alertname' && key != 'severity'"
+                                v-if="item.label != 'alertname' && item.label != 'severity'"
-                                v-for="(value, key) in scope.row.labels">{{value}}</nz-alert-tag>
+                                v-for="item in labelsSort(scope.row.labels)">{{item.value}}</nz-alert-tag>
                 </template>
                 <div v-else-if="item.prop == 'state'">
               <span class="">
@@ -503,6 +503,21 @@ export default {
       startResize(e) {
         let vm = this;
         this.$chartResizeTool.start(vm, this.data, e);
+      },
+      labelsSort:function(obj){
+        let buildIn=['asset','endpoint','module','project','datacenter']
+        let labels=JSON.parse(JSON.stringify(obj));
+        let result=[];
+        for(let key of buildIn){
+          if(key in labels){
+            result.push({label:key,value:labels[key]})
+            delete labels[key]
+          }
+        }
+        Object.keys(labels).sort().forEach(key=>{
+          result.push({label:key,value:labels[key]})
+        })
+        return result;
       },
         labelsClassName(row) {
           if (row.column.label == this.$t("alert.list.labels")) {

nezha-fronted/src/components/common/bottomBox/tabs/alertMessageTab.vue

@@ -92,11 +92,11 @@
             <span v-else>-</span>
           </div>-->
           <template v-else-if="item.prop == 'labels'">
-            <nz-alert-tag :label="key" type="info" style="margin: 5px;"
+            <nz-alert-tag :label="item.label" :type="tagType(item.label)" style="margin: 5px;"
                           :cursor-point="false"
-                          :key="key"
+                          :key="item.label"
-                          v-if="key != 'alertname' && key != 'severity'"
+                          v-if="item.label != 'alertname' && item.label != 'severity'"
-                          v-for="(value, key) in scope.row.labels">{{value}}</nz-alert-tag>
+                          v-for="item in labelsSort(scope.row.labels)">{{item.value}}</nz-alert-tag>
             <!--<el-tag v-if="key != 'alertname' && key != 'severity'"
                     :key="key"
                     type="info"
@@ -362,6 +362,15 @@
       }
     },
     computed: {
+      tagType() {
+        return (key) => {
+          if (key == 'asset' || key == 'module' || key == 'project' || key == 'datacenter' || key == 'endpoint') {
+            return "normal";
+          } else {
+            return "info";
+          }
+        }
+      },
       tagValue() {
         return (key, value) => {
           if (key == 'type') {
@@ -378,6 +387,21 @@
       }
     },
     methods: {
+      labelsSort:function(obj){
+        let buildIn=['asset','endpoint','module','project','datacenter']
+        let labels=JSON.parse(JSON.stringify(obj));
+        let result=[];
+        for(let key of buildIn){
+          if(key in labels){
+            result.push({label:key,value:labels[key]})
+            delete labels[key]
+          }
+        }
+        Object.keys(labels).sort().forEach(key=>{
+          result.push({label:key,value:labels[key]})
+        })
+        return result;
+      },
       elementsetShow(s, e) {
         this.showElementSet = true;
         this.$nextTick(() => {

nezha-fronted/src/components/common/language/cn.js

@@ -139,7 +139,7 @@ const cn = {
             label: "表格"
           },
           stackArea: {
-            label: "面积图"
+            label: "堆叠区域图"
           },
           url: {
             label: "URL",
@@ -703,7 +703,9 @@ const cn = {
         systemName: "系统名称",
         curUrl: "网站URL",
         timezone: "时区",
-        defaultCabinetUsize: "机柜默认U位"
+        defaultCabinetUsize: "机柜默认U位",
+        second:'秒',
+        day:'天'
       },
       email: {
         email: "邮件",
@@ -791,7 +793,8 @@ const cn = {
       name: "名称",
       receiver: "用户组",
       expr: "表达式",
-      for: "For (s)",
+      for: "持续(秒)",
+      second:'秒',
       link: "关联",
       option: "操作",
       alertConfig: "告警规则",

nezha-fronted/src/components/common/language/en.js

@@ -710,7 +710,9 @@ const en = {
         systemName:'System name',
         curUrl:'Current site URL',
         timezone:'Timezone',
-        defaultCabinetUsize:'Cabinet U Size'
+        defaultCabinetUsize:'Cabinet U Size',
+        second:'second',
+        day:'day'
       },
       email:{
         email:'Email',
@@ -801,6 +803,7 @@ const en = {
       receiver: 'Receiver',//"用户组"
       expr: 'Expression',//"表达式"
       for: "Duration (s)",//For (s)
+      second:'second',
       link: 'Link',//'关联'
       option: 'Operation',//"操作"
       alertConfig: 'Alert rule',//"告警规则"

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

@@ -65,7 +65,7 @@
           <!--last-->
           <el-form-item :label="$t('alert.config.for')" prop="last">
             <el-input v-if="rightBox.isEdit" type="text" placeholder="" v-model.number="alertRule.last" size="small">
-              <template slot="append">second</template>
+              <template slot="append">{{$t('alert.config.second')}}</template>
             </el-input>
             <div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{alertRule.last}}s</div>
           </el-form-item>

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

@@ -107,11 +107,11 @@
               </div>-->
               <template v-else-if="item.prop == 'labels'">
 <!--                <nz-alert-tag :label="key" :type="tagType(key)" style="margin: 5px;" @click="showTagDetail(scope.row, key)"-->
-                <nz-alert-tag :label="key" :type="tagType(key)" style="margin: 5px;"
+                <nz-alert-tag :label="item.label" :type="tagType(item.label)" style="margin: 5px;"
-                              :cursor-point="tagType(key) == 'info' ? false : true"
+                              :cursor-point="tagType(item.label) == 'info' ? false : true"
-                              :key="key"
+                              :key="item.label"
-                              v-if="key != 'alertname' && key != 'severity'"
+                              v-if="item.label != 'alertname' && item.label != 'severity'"
-                              v-for="(value, key) in scope.row.labels">{{value}}</nz-alert-tag>
+                              v-for="item in labelsSort(scope.row.labels)">{{item.value}}</nz-alert-tag>
                 <!--<el-tag @click="showTagDetail(scope.row, key)"
                         :key="key"
                         :class="{'link': key == 'asset' || key == 'endpoint' || key == 'project' || key == 'module' || key == 'datacenter'}"
@@ -443,6 +443,21 @@
       }
     },
     methods: {
+      labelsSort:function(obj){
+        let buildIn=['asset','endpoint','module','project','datacenter']
+        let labels=JSON.parse(JSON.stringify(obj));
+        let result=[];
+        for(let key of buildIn){
+          if(key in labels){
+            result.push({label:key,value:labels[key]})
+            delete labels[key]
+          }
+        }
+        Object.keys(labels).sort().forEach(key=>{
+          result.push({label:key,value:labels[key]})
+        })
+        return result;
+      },
       elementsetShow(s, e) {
         var eventfixed = {
           shezhi: 0,

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

@@ -53,10 +53,10 @@
                 <el-input v-model="basic.node_exporter_target_path"></el-input>
               </el-form-item>
               <el-form-item :label="$t('config.system.basic.scrapeInterval')" prop="scrape_interval">
-                <el-input v-model.number="basic.scrape_interval" ></el-input><span class="nz-input-append">s</span>
+                <el-input v-model.number="basic.scrape_interval" ></el-input><span class="nz-input-append">{{$t('config.system.basic.second')}}</span>
               </el-form-item>
               <el-form-item :label="$t('config.system.basic.storageRetention')" prop="storage_local_retention">
-                <el-input v-model.number="basic.storage_local_retention" ></el-input><span class="nz-input-append">d</span>
+                <el-input v-model.number="basic.storage_local_retention" ></el-input><span class="nz-input-append">{{$t('config.system.basic.day')}}</span>
               </el-form-item>
               <el-form-item :label="$t('config.system.basic.timezone')" prop="timezone">
 <!--                <el-input v-model.number="basic.timezone" ></el-input>-->