diff --git a/web-app/src/app/layout/basic/basic.component.ts b/web-app/src/app/layout/basic/basic.component.ts
index e70a178..f0f6281 100644
--- a/web-app/src/app/layout/basic/basic.component.ts
+++ b/web-app/src/app/layout/basic/basic.component.ts
@@ -71,9 +71,9 @@ import { environment } from '@env/environment';
     <setting-drawer *ngIf="showSettingDrawer"></setting-drawer>
     <theme-btn
       [types]="[
-        { key: 'default', text: '浅色主题' },
-        { key: 'dark', text: '深色主题' },
-        { key: 'compact', text: '紧凑主题' }
+        { key: 'default', text: 'app.theme.default' | i18n },
+        { key: 'dark', text: 'app.theme.dark' | i18n },
+        { key: 'compact', text: 'app.theme.compact' | i18n }
       ]"
     ></theme-btn>
   `
diff --git a/web-app/src/app/layout/basic/widgets/clear-storage.component.ts b/web-app/src/app/layout/basic/widgets/clear-storage.component.ts
index 2204ff8..00ea0a3 100644
--- a/web-app/src/app/layout/basic/widgets/clear-storage.component.ts
+++ b/web-app/src/app/layout/basic/widgets/clear-storage.component.ts
@@ -1,4 +1,6 @@
-import { ChangeDetectionStrategy, Component, HostListener } from '@angular/core';
+import { ChangeDetectionStrategy, Component, HostListener, Inject } from '@angular/core';
+import { I18NService } from '@core';
+import { ALAIN_I18N_TOKEN } from '@delon/theme';
 import { NzMessageService } from 'ng-zorro-antd/message';
 import { NzModalService } from 'ng-zorro-antd/modal';
 
@@ -14,15 +16,19 @@ import { NzModalService } from 'ng-zorro-antd/modal';
   changeDetection: ChangeDetectionStrategy.OnPush
 })
 export class HeaderClearStorageComponent {
-  constructor(private modalSrv: NzModalService, private messageSrv: NzMessageService) {}
+  constructor(
+    private modalSrv: NzModalService,
+    private messageSrv: NzMessageService,
+    @Inject(ALAIN_I18N_TOKEN) private i18nSvc: I18NService
+  ) {}
 
   @HostListener('click')
   _click(): void {
     this.modalSrv.confirm({
-      nzTitle: '请确认是否清理缓存?',
+      nzTitle: this.i18nSvc.fanyi('common.confirm.clear-cache'),
       nzOnOk: () => {
         localStorage.clear();
-        this.messageSrv.success('清理成功!');
+        this.messageSrv.success(this.i18nSvc.fanyi('common.notify.clear-success'));
       }
     });
   }
diff --git a/web-app/src/app/layout/basic/widgets/notify.component.ts b/web-app/src/app/layout/basic/widgets/notify.component.ts
index 89be038..3fe728d 100644
--- a/web-app/src/app/layout/basic/widgets/notify.component.ts
+++ b/web-app/src/app/layout/basic/widgets/notify.component.ts
@@ -26,11 +26,11 @@ import { AlertService } from '../../../service/alert.service';
 export class HeaderNotifyComponent implements OnInit {
   data: NoticeItem[] = [
     {
-      title: '近期未处理告警',
+      title: this.i18nSvc.fanyi('dashboard.alerts.title-no'),
       list: [],
-      emptyText: '暂无未处理告警',
+      emptyText: this.i18nSvc.fanyi('dashboard.alerts.no'),
       emptyImage: 'https://gw.alipayobjects.com/zos/rmsportal/wAhyIChODzsoKIOBHcBk.svg',
-      clearText: '进入告警中心'
+      clearText: this.i18nSvc.fanyi('dashboard.alerts.enter')
     }
   ];
   count = 0;
@@ -69,10 +69,10 @@ export class HeaderNotifyComponent implements OnInit {
             let item = {
               id: alert.id,
               avatar: 'https://gw.alipayobjects.com/zos/rmsportal/ThXAXghbEsBCCSDihZxY.png',
-              title: `监控-${alert.monitorName}-发出${this.i18nSvc.fanyi(`alert.priority.${alert.priority}`)}`,
+              title: `${alert.monitorName}--${this.i18nSvc.fanyi(`alert.priority.${alert.priority}`)}`,
               datetime: alert.gmtCreate,
               color: 'blue',
-              type: '近期未处理告警'
+              type: this.i18nSvc.fanyi('dashboard.alerts.title-no')
             };
             this.data[0].list.push(item);
           });
diff --git a/web-app/src/app/layout/basic/widgets/search.component.ts b/web-app/src/app/layout/basic/widgets/search.component.ts
index 2ee5219..610347c 100644
--- a/web-app/src/app/layout/basic/widgets/search.component.ts
+++ b/web-app/src/app/layout/basic/widgets/search.component.ts
@@ -40,8 +40,8 @@ import { MonitorService } from '../../../service/monitor.service';
     <nz-autocomplete nzBackfill="false" nzDefaultActiveFirstOption #auto>
       <nz-auto-option *ngFor="let option of options" [nzValue]="option.id" [nzLabel]="option.name">
         <a [routerLink]="['/monitors/' + option.id]">
-          监控名称: {{ option.name }}
-          <span style="left:50% ; position: absolute;">监控Host: {{ option.host }}</span>
+          {{ 'monitor.name' | i18n }} : {{ option.name }}
+          <span style="left:50% ; position: absolute;">{{ 'monitor.host' | i18n }} : {{ option.host }}</span>
           <span style="right: 10px; position: absolute;"><i nz-icon nzType="arrow-right" nzTheme="outline"></i></span>
         </a>
       </nz-auto-option>
diff --git a/web-app/src/assets/i18n/en-US.json b/web-app/src/assets/i18n/en-US.json
index 773cfba..3409201 100644
--- a/web-app/src/assets/i18n/en-US.json
+++ b/web-app/src/assets/i18n/en-US.json
@@ -173,6 +173,8 @@
   "alert.notice.rule.all": "Dispatch ALl",
   "alert.notice.rule.enable": "Enable",
   "dashboard.alerts.title": "Recently Alerts List",
+  "dashboard.alerts.title-no": "Recently Pending Alerts",
+  "dashboard.alerts.no": "No Pending Alerts",
   "dashboard.alerts.enter": "Go Alert Center",
   "dashboard.alerts.distribute": "The Distribution Of Alerts",
   "dashboard.alerts.num": "Alerts Num",
@@ -263,6 +265,8 @@
   "common.confirm.enable": "Please confirm whether to enable monitor!",
   "common.notify.enable-success": "Enable Success!",
   "common.notify.enable-fail": "Enable Failed!",
+  "common.confirm.clear-cache": "Please confirm whether to clear cache!",
+  "common.notify.clear-success": "Clear Success!",
   "common.button.ok": "OK",
   "common.button.cancel": "Cancel",
   "common.button.help": "Help",
@@ -273,6 +277,9 @@
   "validation.phone.invalid": "Invalid phone number！",
   "validation.verification-code.invalid": "Invalid verification code, should be 6 digits！",
   "validation.required": "Please fill in the required fields! ",
+  "app.theme.default": "Light Theme",
+  "app.theme.dark": "Dark Theme",
+  "app.theme.compact": "Compact Theme",
   "app.role.admin": "Administrator",
   "app.lock": "Lock",
   "app.lock.placeholder": "Enter Any To Unlock",
diff --git a/web-app/src/assets/i18n/zh-CN.json b/web-app/src/assets/i18n/zh-CN.json
index 2e8240e..3abef96 100644
--- a/web-app/src/assets/i18n/zh-CN.json
+++ b/web-app/src/assets/i18n/zh-CN.json
@@ -173,6 +173,8 @@
   "alert.notice.rule.all": "转发所有",
   "alert.notice.rule.enable": "是否启用",
   "dashboard.alerts.title": "最近告警列表",
+  "dashboard.alerts.title-no": "最近未处理告警",
+  "dashboard.alerts.no": "暂无未处理告警",
   "dashboard.alerts.enter": "进入告警中心",
   "dashboard.alerts.distribute": "告警分布",
   "dashboard.alerts.num": "告警数量",
@@ -263,12 +265,17 @@
   "common.confirm.enable": "请确认是否启用监控!",
   "common.notify.enable-success": "启用监控成功!",
   "common.notify.enable-fail": "启用监控失败!",
+  "common.confirm.clear-cache": "请确认是否清理缓存!",
+  "common.notify.clear-success": "清理成功!",
   "common.button.ok": "确定",
   "common.button.detect": "测试",
   "common.button.cancel": "取消",
   "common.button.help": "帮助",
   "common.button.edit": "编辑",
   "common.button.delete": "删除",
+  "app.theme.default": "浅色主题",
+  "app.theme.dark": "深色主题",
+  "app.theme.compact": "紧凑主题",
   "app.role.admin": "管理员",
   "app.lock": "锁屏",
   "app.lock.placeholder": "输入任意解锁",