update

src/main/webapp/app/alarm/alarm-set/alarm-set.component.html

@@ -82,5 +82,5 @@
 <!--告警组-->
 <smart-alarm-group #smartAlarmGroup (add)="getGroupAlarm()"></smart-alarm-group>
 
-<!--新增告警推送-->
+<!--告警推送-->
 <smart-alarm-modal #smartAlarmModal (done)="getList()" ></smart-alarm-modal>
\ No newline at end of file

src/main/webapp/app/modal/alarm-modal/alarm-modal.component.html

 <!--添加资源-->
-<nz-modal [nzWidth]="1080" [nzFooter]="null" [(nzVisible)]="isShow" [nzTitle]="title"
-          (nzOnCancel)="handleEditCancel()" (nzOnOk)="handEditleOk()">
-    <nz-tabset [nzSelectedIndex]="tabNum" (nzSelectedIndexChange)="tabsChange($event)" style="padding-bottom: 25px;min-height: 500px">
+<nz-modal [nzWidth]="1080" [(nzVisible)]="isShow" [nzTitle]="title" (nzOnCancel)="handleEditCancel()" (nzOnOk)="handEditleOk()" [nzOkLoading]="isOkLoading">
+    <nz-tabset [(nzSelectedIndex)]="tabNum" (nzSelectedIndexChange)="tabsChange($event)" style="padding-bottom: 25px;min-height: 500px">
         <nz-tab nzTitle="选定告警目标">
             <div nz-form class="ant-advanced-search-form form-select">
                 <nz-form-item>
                     <nz-form-label [nzSpan]="4" nzRequired nzFor="hostName">告警名称</nz-form-label>
                     <nz-form-control [nzSpan]="14">
-                        <input id="hostName" type="text" nz-input name="hostName" [(ngModel)]="validateForm.name">
+                        <input type="text" nz-input name="hostName" [(ngModel)]="validateForm.name">
                     </nz-form-control>
                 </nz-form-item>
 
@@ -15,14 +14,28 @@
                     <nz-form-label [nzSpan]="4" nzRequired nzFor="host1">告警目标</nz-form-label>
                     <nz-form-control [nzSpan]="14">
                         <div class="tree-div">
+                            <!--<nz-tree #nzTree-->
+                                     <!--[(ngModel)]="nodes"-->
+                                     <!--[nzCheckable]="true"-->
+                                     <!--[nzAsyncData]="true"-->
+                                     <!--[nzCheckStrictly]="true"-->
+                                     <!--(nzCheckBoxChange)="selectCheckTree($event)"-->
+                            <!--(nzClick)="mouseAction('expand',$event)"-->
+                            <!--(nzExpandChange)="mouseAction('expand',$event)" >-->
+                            <!--</nz-tree>-->
+
                             <nz-tree #nzTree
                                      [(ngModel)]="nodes"
-                                     [nzCheckable]="true"
                                      [nzAsyncData]="true"
                                      [nzCheckStrictly]="true"
-                                     (nzCheckBoxChange)="selectCheckTree($event)"
                                      (nzClick)="mouseAction('expand',$event)"
                                      (nzExpandChange)="mouseAction('expand',$event)" >
+                                    <ng-template #nzTreeTemplate let-node>
+                                        <span class="custom-node" draggable="true" aria-grabbed="true" [class.active]="node.isSelected">
+                                            <label *ngIf="node.level == 0"> {{node.title}}</label>
+                                            <label [(ngModel)]="node.isChecked" [nzDisabled]="node.origin.disabled" (click)="selectCheckTree(node)" *ngIf="node.level == 1" nz-checkbox> {{node.title}}</label>
+                                        </span>
+                                    </ng-template>
                             </nz-tree>
                         </div>
                     </nz-form-control>
@@ -34,7 +47,7 @@
                     <nz-form-control [nzSpan]="14">
                         <nz-select name="groupIds" nzPlaceHolder="告警分组" [(ngModel)]="validateForm.alertGroupId">
                             <ng-container *ngFor="let item of groupList;let i = index;">
-                                <nz-option nzLabel="{{item.name}}" nzValue="{{item.id}}"></nz-option>
+                                <nz-option [nzLabel]="item.name" [nzValue]="item.id"></nz-option>
                             </ng-container>
                         </nz-select>
                     </nz-form-control>
@@ -47,11 +60,6 @@
                     <!--</nz-form-control>-->
                 <!--</nz-form-item>-->
             </div>
-
-            <div class="modal-footer-btn">
-                <button nz-button (click)="handleEditCancel()" nzType="primary">取消</button>
-                <button nz-button (click)="tabsChange(1)" nzType="primary">下一步</button>
-            </div>
         </nz-tab>
 
         <nz-tab nzTitle="选择发送策略">
@@ -178,11 +186,6 @@
                     </nz-form-item>
                 </ng-container>
             </div>
-            <div class="modal-footer-btn">
-                <button nz-button (click)="handleEditCancel()" nzType="primary">取消</button>
-                <button nz-button (click)="tabsChange(0)" nzType="primary">上一步</button>
-                <button nz-button (click)="tabsChange(2)" nzType="primary">下一步</button>
-            </div>
         </nz-tab>
 
         <nz-tab nzTitle="选择发送方式">
@@ -236,11 +239,6 @@
                     </nz-form-item>
                 </ng-container>
             </div>
-            <div class="modal-footer-btn">
-                <button nz-button (click)="handleEditCancel()" nzType="primary">取消</button>
-                <button nz-button (click)="tabsChange(1)" nzType="primary">上一步</button>
-                <button nz-button (click)="handEditleOk()" nzType="primary">完成</button>
-            </div>
         </nz-tab>
     </nz-tabset>
 </nz-modal>

src/main/webapp/app/modal/alarm-modal/alarm-modal.component.ts

@@ -29,6 +29,7 @@ export class AlarmModalComponent implements OnInit {
     title;
     tabNum = 0;
     isShow = false;
+    isOkLoading = false;
     nodes;
     nodeList;
     actionid;  //告警Id
@@ -174,11 +175,11 @@ export class AlarmModalComponent implements OnInit {
     }
 
     //选择树节点
-    selectCheckTree(event: NzFormatEmitEvent) {
-        if (event.node.isChecked) {
-            this.selectTreeList.push(event.node.key);
+    selectCheckTree(node) {
+        if (node.isChecked) {
+            this.selectTreeList.push(node.origin.hostid);
         } else {
-            const index = this.selectTreeList.indexOf(event.node.key);
+            const index = this.selectTreeList.indexOf(node.origin.hostid);
             this.selectTreeList.splice(index, 1);
         }
     }
@@ -317,7 +318,7 @@ export class AlarmModalComponent implements OnInit {
         if (!this.check()) {
             return false;
         }
-
+        this.isOkLoading = true;
         const optionArr = [];
         this.sendOption.forEach(res => {
             if (res.checked) {
@@ -425,6 +426,7 @@ export class AlarmModalComponent implements OnInit {
                 } else {
                     this.message.error(res.errMsg);
                 }
+                this.isOkLoading = false;
             }
         );
     }
@@ -442,6 +444,7 @@ export class AlarmModalComponent implements OnInit {
                 } else {
                     this.message.error(res.errMsg);
                 }
+                this.isOkLoading = false;
             }
         );
     }