[webapp] 批量处理eslint格式告警

web-app/src/app/routes/alert/alert-setting/alert-setting.component.html

@@ -17,7 +17,7 @@
   <i nz-icon nzType="appstore-add" nzTheme="outline"></i>
   新增阈值
 </button>
-<button nz-button nzType="primary" (click)="onEditAlertDefine()" >
+<button nz-button nzType="primary" (click)="onEditAlertDefine()">
   <i nz-icon nzType="edit" nzTheme="outline"></i>
   编辑
 </button>
@@ -29,110 +29,110 @@
   <i nz-icon nzType="sync" nzTheme="outline"></i>
 </button>
 
-<nz-table #fixedTable [nzData]="defines"
-          [nzPageIndex]="pageIndex" [nzPageSize]="pageSize" [nzTotal]="total"
-          nzFrontPagination ="false"
-          [nzLoading] = "tableLoading"
-          nzShowSizeChanger
-          [nzShowTotal]="rangeTemplate"
-          [nzPageSizeOptions]="[8,15,25]"
-          (nzQueryParams)="onTablePageChange($event)"
-          nzShowPagination = "true" [nzScroll]="{ x: '1150px', y: '1240px' }">
+<nz-table
+  #fixedTable
+  [nzData]="defines"
+  [nzPageIndex]="pageIndex"
+  [nzPageSize]="pageSize"
+  [nzTotal]="total"
+  nzFrontPagination="false"
+  [nzLoading]="tableLoading"
+  nzShowSizeChanger
+  [nzShowTotal]="rangeTemplate"
+  [nzPageSizeOptions]="[8, 15, 25]"
+  (nzQueryParams)="onTablePageChange($event)"
+  nzShowPagination="true"
+  [nzScroll]="{ x: '1150px', y: '1240px' }"
+>
   <thead>
-  <tr>
-    <th nzAlign="center" nzLeft nzWidth="60px" [(nzChecked)]="checkedAll" (nzCheckedChange)="onAllChecked($event)"></th>
-    <th nzAlign="center">指标对象</th>
-    <th nzAlign="center">阈值触发表达式</th>
-    <th nzAlign="center">告警级别</th>
-    <th nzAlign="center">触发次数</th>
-    <th nzAlign="center">通知模版</th>
-    <th nzAlign="center">全局默认</th>
-    <th nzAlign="center">最新修改时间</th>
-    <th nzAlign="center" nzRight>操作</th>
-  </tr>
+    <tr>
+      <th nzAlign="center" nzLeft nzWidth="60px" [(nzChecked)]="checkedAll" (nzCheckedChange)="onAllChecked($event)"></th>
+      <th nzAlign="center">指标对象</th>
+      <th nzAlign="center">阈值触发表达式</th>
+      <th nzAlign="center">告警级别</th>
+      <th nzAlign="center">触发次数</th>
+      <th nzAlign="center">通知模版</th>
+      <th nzAlign="center">全局默认</th>
+      <th nzAlign="center">最新修改时间</th>
+      <th nzAlign="center" nzRight>操作</th>
+    </tr>
   </thead>
   <tbody>
-  <tr *ngFor="let data of fixedTable.data">
-    <td nzAlign="center" nzLeft [nzChecked]="checkedDefineIds.has(data.id)" (nzCheckedChange)="onItemChecked(data.id, $event)"></td>
-    <td nzAlign="center">
-        <span>{{ data.app + '.'  + data.metric + '.' + data.field }}</span>
-    </td>
-    <td nzAlign="center">
-      <span>{{ data.expr}}</span>
-    </td>
-    <td nzAlign="center">
-      <nz-tag *ngIf="data.priority == 0" nzColor="red">
-        <i nz-icon nzType="bell" nzTheme="outline"></i>
-        <span>紧急告警</span>
-      </nz-tag>
-      <nz-tag *ngIf="data.priority == 1" nzColor="orange">
-        <i nz-icon nzType="bell" nzTheme="outline"></i>
-        <span>严重告警</span>
-      </nz-tag>
-      <nz-tag *ngIf="data.priority == 2" nzColor="yellow">
-        <i nz-icon nzType="bell" nzTheme="outline"></i>
-        <span>警告告警</span>
-      </nz-tag>
-    </td>
-    <td nzAlign="center">{{ data.times }}</td>
-    <td nzAlign="center">{{ data.template }}</td>
-    <td nzAlign="center">
-      <nz-tag *ngIf="data.preset" nzColor="green">
-        <span>是</span>
-      </nz-tag>
-      <nz-tag *ngIf="!data.preset" nzColor="orange">
-        <span>否</span>
-      </nz-tag>
-    </td>
-    <td nzAlign="center">{{ data.gmtUpdate? data.gmtUpdate : data.gmtCreate }}</td>
-    <td nzAlign="center" nzRight>
-      <button nz-button nzType="primary" (click)="onOpenConnectModal(data.id, data.app)" nz-tooltip nzTooltipTitle="配置关联监控">
-        <i nz-icon nzType="link" nzTheme="outline"></i>
-      </button>
-      <button nz-button nzType="primary" (click)="onEditOneAlertDefine(data.id)" nz-tooltip nzTooltipTitle="修改告警配置">
-        <i nz-icon nzType="edit" nzTheme="outline"></i>
-      </button>
-      <button nz-button nzType="primary" (click)="onDeleteOneAlertDefine(data.id)" nz-tooltip nzTooltipTitle="删除告警配置">
-        <i nz-icon nzType="delete" nzTheme="outline"></i>
-      </button>
-    </td>
-  </tr>
+    <tr *ngFor="let data of fixedTable.data">
+      <td nzAlign="center" nzLeft [nzChecked]="checkedDefineIds.has(data.id)" (nzCheckedChange)="onItemChecked(data.id, $event)"></td>
+      <td nzAlign="center">
+        <span>{{ data.app + '.' + data.metric + '.' + data.field }}</span>
+      </td>
+      <td nzAlign="center">
+        <span>{{ data.expr }}</span>
+      </td>
+      <td nzAlign="center">
+        <nz-tag *ngIf="data.priority == 0" nzColor="red">
+          <i nz-icon nzType="bell" nzTheme="outline"></i>
+          <span>紧急告警</span>
+        </nz-tag>
+        <nz-tag *ngIf="data.priority == 1" nzColor="orange">
+          <i nz-icon nzType="bell" nzTheme="outline"></i>
+          <span>严重告警</span>
+        </nz-tag>
+        <nz-tag *ngIf="data.priority == 2" nzColor="yellow">
+          <i nz-icon nzType="bell" nzTheme="outline"></i>
+          <span>警告告警</span>
+        </nz-tag>
+      </td>
+      <td nzAlign="center">{{ data.times }}</td>
+      <td nzAlign="center">{{ data.template }}</td>
+      <td nzAlign="center">
+        <nz-tag *ngIf="data.preset" nzColor="green">
+          <span>是</span>
+        </nz-tag>
+        <nz-tag *ngIf="!data.preset" nzColor="orange">
+          <span>否</span>
+        </nz-tag>
+      </td>
+      <td nzAlign="center">{{ data.gmtUpdate ? data.gmtUpdate : data.gmtCreate }}</td>
+      <td nzAlign="center" nzRight>
+        <button nz-button nzType="primary" (click)="onOpenConnectModal(data.id, data.app)" nz-tooltip nzTooltipTitle="配置关联监控">
+          <i nz-icon nzType="link" nzTheme="outline"></i>
+        </button>
+        <button nz-button nzType="primary" (click)="onEditOneAlertDefine(data.id)" nz-tooltip nzTooltipTitle="修改告警配置">
+          <i nz-icon nzType="edit" nzTheme="outline"></i>
+        </button>
+        <button nz-button nzType="primary" (click)="onDeleteOneAlertDefine(data.id)" nz-tooltip nzTooltipTitle="删除告警配置">
+          <i nz-icon nzType="delete" nzTheme="outline"></i>
+        </button>
+      </td>
+    </tr>
   </tbody>
 </nz-table>
 
-<ng-template #rangeTemplate>
-  总量 {{ total }}
-</ng-template>
+<ng-template #rangeTemplate> 总量 {{ total }} </ng-template>
 
 <!-- 新增或修改告警定义弹出框 -->
 <nz-modal
   [(nzVisible)]="isManageModalVisible"
-  [nzTitle]="isManageModalAdd?'新增告警阈值' : '修改告警阈值'"
+  [nzTitle]="isManageModalAdd ? '新增告警阈值' : '修改告警阈值'"
   (nzOnCancel)="onManageModalCancel()"
   (nzOnOk)="onManageModalOk()"
   nzMaskClosable="false"
   nzWidth="60%"
   [nzOkLoading]="isManageModalOkLoading"
 >
-  <div *nzModalContent class = "-inner-content">
+  <div *nzModalContent class="-inner-content">
     <form nz-form>
       <nz-form-item>
-        <nz-form-label [nzSpan]="7" nzFor= 'target' nzRequired="true">指标对象</nz-form-label>
+        <nz-form-label [nzSpan]="7" nzFor="target" nzRequired="true">指标对象</nz-form-label>
         <nz-form-control [nzSpan]="8">
-          <nz-cascader name="target" id="target" [nzOptions]="appHierarchies" [(ngModel)]="cascadeValues">
-          </nz-cascader>
+          <nz-cascader name="target" id="target" [nzOptions]="appHierarchies" [(ngModel)]="cascadeValues"> </nz-cascader>
         </nz-form-control>
-      </nz-form-item >
+      </nz-form-item>
       <nz-form-item>
         <nz-col [nzSpan]="8" nzOffset="7">
           <nz-collapse>
-            <nz-collapse-panel
-              [nzActive] = "isManageModalAdd"
-              nzHeader="支持的阈值触发表达式环境变量与操作符"
-            >
+            <nz-collapse-panel [nzActive]="isManageModalAdd" nzHeader="支持的阈值触发表达式环境变量与操作符">
               <nz-list nzSize="small" nzSplit="false">
                 <nz-list-item *ngIf="cascadeValues.length == 3">
-                  <code>{{cascadeValues[2]}} : 选中的指标对象</code>
+                  <code>{{ cascadeValues[2] }} : 选中的指标对象</code>
                 </nz-list-item>
                 <nz-list-item>
                   <code>instance : 所属行实例值</code>
@@ -146,29 +146,39 @@
         </nz-col>
       </nz-form-item>
       <nz-form-item>
-        <nz-form-label [nzSpan]="7" nzFor= 'expr' nzRequired="true" nzTooltipTitle="根据此表达式来计算判断是否触发阈值,表达式环境变量和操作符见上方">
+        <nz-form-label
+          [nzSpan]="7"
+          nzFor="expr"
+          nzRequired="true"
+          nzTooltipTitle="根据此表达式来计算判断是否触发阈值,表达式环境变量和操作符见上方"
+        >
           阈值触发表达式
         </nz-form-label>
         <nz-form-control [nzSpan]="8">
           <nz-textarea-count [nzMaxCharacterCount]="100">
-            <textarea [(ngModel)]="define.expr" rows="3" nz-input
-                      name="expr" id="expr"  placeholder="根据此表达式计算判断是否触发阈值.&#10;示例: equals&#40;instance,&quot;cpu1&quot;&#41; &amp;&amp; usage&gt;40">
+            <textarea
+              [(ngModel)]="define.expr"
+              rows="3"
+              nz-input
+              name="expr"
+              id="expr"
+              placeholder='根据此表达式计算判断是否触发阈值.&#10;示例: equals&#40;instance,"cpu1"&#41; &amp;&amp; usage&gt;40'
+            >
             </textarea>
           </nz-textarea-count>
         </nz-form-control>
-      </nz-form-item >
+      </nz-form-item>
       <nz-form-item>
-        <nz-form-label nzSpan="7" nzRequired="true" nzFor= "priority"
-                       nzTooltipTitle="触发阈值的告警级别,从低到高依次为:警告-warning，严重-critical，紧急-emergency">
+        <nz-form-label
+          nzSpan="7"
+          nzRequired="true"
+          nzFor="priority"
+          nzTooltipTitle="触发阈值的告警级别,从低到高依次为:警告-warning，严重-critical，紧急-emergency"
+        >
           告警级别
         </nz-form-label>
         <nz-form-control nzSpan="8">
-          <nz-select
-            [(ngModel)]="define.priority"
-            nzAllowClear
-            nzPlaceHolder="Choose"
-            name="priority" id="priority"
-          >
+          <nz-select [(ngModel)]="define.priority" nzAllowClear nzPlaceHolder="Choose" name="priority" id="priority">
             <nz-option [nzValue]="0" nzLabel="紧急告警"></nz-option>
             <nz-option [nzValue]="1" nzLabel="严重告警"></nz-option>
             <nz-option [nzValue]="2" nzLabel="警告告警"></nz-option>
@@ -176,28 +186,24 @@
         </nz-form-control>
       </nz-form-item>
       <nz-form-item>
-        <nz-form-label nzSpan="7" nzRequired="true" nzFor= "duration" nzTooltipTitle="设置触发阈值多少次之后才会发送告警">
+        <nz-form-label nzSpan="7" nzRequired="true" nzFor="duration" nzTooltipTitle="设置触发阈值多少次之后才会发送告警">
           触发次数
         </nz-form-label>
         <nz-form-control nzSpan="8">
-          <nz-input-number [(ngModel)]="define.times" [nzMin]="1" [nzMax]="10" [nzStep]="1"
-                           name="duration" id="duration">
+          <nz-input-number [(ngModel)]="define.times" [nzMin]="1" [nzMax]="10" [nzStep]="1" name="duration" id="duration">
           </nz-input-number>
         </nz-form-control>
-      </nz-form-item >
+      </nz-form-item>
       <nz-form-item>
         <nz-col [nzSpan]="8" nzOffset="7">
           <nz-collapse>
-            <nz-collapse-panel
-              [nzActive] = "isManageModalAdd"
-              nzHeader="支持的通知模版环境变量"
-            >
+            <nz-collapse-panel [nzActive]="isManageModalAdd" nzHeader="支持的通知模版环境变量">
               <nz-list nzSize="small" nzSplit="false">
                 <nz-list-item *ngIf="cascadeValues.length == 3">
                   <code>&#36;&#40;metric&#41; : 选中的指标对象名称</code>
                 </nz-list-item>
                 <nz-list-item *ngIf="cascadeValues.length == 3">
-                  <code>&#36;&#40;{{cascadeValues[2]}}&#41; : 选中的指标对象值</code>
+                  <code>&#36;&#40;{{ cascadeValues[2] }}&#41; : 选中的指标对象值</code>
                 </nz-list-item>
                 <nz-list-item>
                   <code>&#36;&#40;instance&#41; : 所在行实例值</code>
@@ -214,33 +220,37 @@
         </nz-col>
       </nz-form-item>
       <nz-form-item>
-        <nz-form-label [nzSpan]="7" nzFor= 'template' nzRequired="true" nzTooltipTitle="告警触发后发送的通知信息模版,模版环境变量见上方">
+        <nz-form-label [nzSpan]="7" nzFor="template" nzRequired="true" nzTooltipTitle="告警触发后发送的通知信息模版,模版环境变量见上方">
           通知模版
         </nz-form-label>
         <nz-form-control [nzSpan]="8">
           <nz-textarea-count [nzMaxCharacterCount]="200">
-            <textarea [(ngModel)]="define.template" rows="3" nz-input
-                      name="template" id="template"  placeholder="请输入告警的通知模版.&#10;示例: ${app}.${metrics}.${metric}'s value is too high">
+            <textarea
+              [(ngModel)]="define.template"
+              rows="3"
+              nz-input
+              name="template"
+              id="template"
+              placeholder="请输入告警的通知模版.&#10;示例: ${app}.${metrics}.${metric}'s value is too high"
+            >
             </textarea>
           </nz-textarea-count>
         </nz-form-control>
       </nz-form-item>
       <nz-form-item>
-        <nz-form-label nzSpan="7" nzRequired="true" nzFor= "preset" nzTooltipTitle="此告警阈值配置是否应用于全局所有此类型监控">
+        <nz-form-label nzSpan="7" nzRequired="true" nzFor="preset" nzTooltipTitle="此告警阈值配置是否应用于全局所有此类型监控">
           全局默认
         </nz-form-label>
         <nz-form-control nzSpan="8">
           <nz-switch [(ngModel)]="define.preset" name="preset" id="preset"></nz-switch>
         </nz-form-control>
-      </nz-form-item >
+      </nz-form-item>
       <nz-form-item>
-        <nz-form-label nzSpan="7" nzRequired="true" nzFor= "enable" nzTooltipTitle="此告警阈值配置开启生效或关闭">
-          启用告警
-        </nz-form-label>
+        <nz-form-label nzSpan="7" nzRequired="true" nzFor="enable" nzTooltipTitle="此告警阈值配置开启生效或关闭"> 启用告警 </nz-form-label>
         <nz-form-control nzSpan="8">
           <nz-switch [(ngModel)]="define.enable" name="enable" id="enable"></nz-switch>
         </nz-form-control>
-      </nz-form-item >
+      </nz-form-item>
     </form>
   </div>
 </nz-modal>
@@ -274,21 +284,17 @@
     >
       <nz-table #t [nzData]="$asTransferItems(items)" nzSize="small">
         <thead>
-        <tr>
-          <th [nzChecked]="stat.checkAll" [nzIndeterminate]="stat.checkHalf"
-            (nzCheckedChange)="onItemSelectAll($event)"></th>
-          <th *ngIf="direction=='left'">未关联监控</th>
-          <th *ngIf="direction=='right'">已关联监控</th>
-        </tr>
+          <tr>
+            <th [nzChecked]="stat.checkAll" [nzIndeterminate]="stat.checkHalf" (nzCheckedChange)="onItemSelectAll($event)"></th>
+            <th *ngIf="direction == 'left'">未关联监控</th>
+            <th *ngIf="direction == 'right'">已关联监控</th>
+          </tr>
         </thead>
         <tbody>
-        <tr *ngFor="let data of t.data" (click)="onItemSelect(data)">
-          <td
-            [nzChecked]="!!data.checked"
-            (nzCheckedChange)="onItemSelect(data)"
-          ></td>
-          <td>{{ data.name }}</td>
-        </tr>
+          <tr *ngFor="let data of t.data" (click)="onItemSelect(data)">
+            <td [nzChecked]="!!data.checked" (nzCheckedChange)="onItemSelect(data)"></td>
+            <td>{{ data.name }}</td>
+          </tr>
         </tbody>
       </nz-table>
     </ng-template>