diff --git a/src/views/charts2/charts/entityDetail/tabs/PerformanceEvent.vue b/src/views/charts2/charts/entityDetail/tabs/PerformanceEvent.vue
index 6b04f0df..f075b4a6 100644
--- a/src/views/charts2/charts/entityDetail/tabs/PerformanceEvent.vue
+++ b/src/views/charts2/charts/entityDetail/tabs/PerformanceEvent.vue
@@ -26,7 +26,7 @@
                     <div class="basic-info__item" v-if="item.eventSeverity">
                       <i class="cn-icon cn-icon-severity-level"></i>
                       <span>{{ $t('network.severity') }}&nbsp;:&nbsp;&nbsp;</span>
-                      <span :test-id="`severity${index}`">{{ toUpperCaseByString(item.eventSeverity) || '-' }}</span>
+                      <span :test-id="`severity${index}`">{{ changeSecurity(item.eventSeverity) }}</span>
                     </div>
                     <div class="basic-info__item">
                       <i class="cn-icon cn-icon-time2"></i>
@@ -51,7 +51,7 @@
 
 <script>
 import { dateFormatByAppearance } from '@/utils/date-util'
-import { eventSeverityColor, entityDetailTabsName } from '@/utils/constants'
+import { eventSeverityColor, entityDetailTabsName, securityLevel } from '@/utils/constants'
 import unitConvert from '@/utils/unit-convert'
 import axios from 'axios'
 import { api } from '@/utils/api'
@@ -130,6 +130,18 @@ export default {
       this.showError = true
       this.errorMsg = this.errorMsgHandler(e)
       this.$emit('checkTag', entityDetailTabsName.performanceEvent, 0)
+    },
+    changeSecurity (value) {
+      if (value) {
+        const obj = securityLevel.find(d => d.value === value)
+        let label = value
+        if (obj) {
+          label = this.$t(obj.label)
+        }
+        return label
+      } else {
+        return '-'
+      }
     }
   }
 }
diff --git a/src/views/charts2/charts/entityDetail/tabs/SecurityEvent.vue b/src/views/charts2/charts/entityDetail/tabs/SecurityEvent.vue
index c06f3b8f..a720be87 100644
--- a/src/views/charts2/charts/entityDetail/tabs/SecurityEvent.vue
+++ b/src/views/charts2/charts/entityDetail/tabs/SecurityEvent.vue
@@ -38,7 +38,7 @@
                   <div class="basic-info__item" v-if="item.eventSeverity">
                     <i class="cn-icon cn-icon-severity-level"></i>
                     <span>{{ $t('network.severity') }}&nbsp;:&nbsp;&nbsp;</span>
-                    <span>{{ toUpperCaseByString(item.eventSeverity) || '-' }}</span>
+                    <span>{{ changeSecurity(item.eventSeverity) }}</span>
                   </div>
                   <div class="basic-info__item" v-if="item.eventType">
                     <i class="cn-icon cn-icon-event-type"></i>
@@ -77,7 +77,7 @@
 
 <script>
 import { dateFormatByAppearance } from '@/utils/date-util'
-import { eventSeverityColor, entityDetailTabsName } from '@/utils/constants'
+import { eventSeverityColor, entityDetailTabsName, securityLevel } from '@/utils/constants'
 import unitConvert from '@/utils/unit-convert'
 import axios from 'axios'
 import { api } from '@/utils/api'
@@ -155,6 +155,18 @@ export default {
       this.isNoData = false
       this.showError = true
       this.errorMsg = this.errorMsgHandler(e)
+    },
+    changeSecurity (value) {
+      if (value) {
+        const obj = securityLevel.find(d => d.value === value)
+        let label = value
+        if (obj) {
+          label = this.$t(obj.label)
+        }
+        return label
+      } else {
+        return '-'
+      }
     }
   }
 }
diff --git a/src/views/charts2/charts/npm/NpmRecentEvents.vue b/src/views/charts2/charts/npm/NpmRecentEvents.vue
index d8186652..f68d85dd 100644
--- a/src/views/charts2/charts/npm/NpmRecentEvents.vue
+++ b/src/views/charts2/charts/npm/NpmRecentEvents.vue
@@ -21,7 +21,7 @@
           <template  #default="scope" :column="item">
             <div class="data-recent-table">
               <template v-if="item.prop === 'eventSeverity'">
-                <span class="data-recent-table-severity" :class="scope.row[item.prop]" :test-id="`eventSeverity-${scope.row.eventSeverity}-${scope.$index}`">{{scope.row[item.prop]}}</span>
+                <span class="data-recent-table-severity" :class="scope.row[item.prop]" :test-id="`eventSeverity-${scope.row.eventSeverity}-${scope.$index}`">{{ getEventSeverity(scope.row[item.prop]) }}</span>
               </template>
               <template v-else-if="item.prop === 'eventKey'">
                 <span class="data-recent-table-entity click-active" @click="jumpPage(scope.row)" :test-id="`eventKey-${splitEventKey(scope.row.eventKey)}-${scope.$index}`">{{splitEventKey(scope.row[item.prop])}}</span>
@@ -57,6 +57,7 @@ import ChartError from '@/components/common/Error'
 import axios from 'axios'
 import { dataForNpmRecentEvents } from '@/utils/static-data'
 import { beforeRouterPush } from '@/utils/tools'
+import { securityLevel } from '@/utils/constants'
 
 export default {
   name: 'NpmRecentEvents',
@@ -158,6 +159,14 @@ export default {
       this.isNoData = false
       this.showError = true
       this.errorMsg = this.errorMsgHandler(res)
+    },
+    getEventSeverity (severity) {
+      const obj = securityLevel.find(d => d.value === severity)
+      if (obj) {
+        return this.$t(obj.label)
+      } else {
+        return severity
+      }
     }
   },
   mounted () {