Skip to content
alarm-modal.component.html 14.5 KiB
Newer Older
wangqinghua's avatar
wangqinghua committed
<!--告警推送-->
wangqinghua's avatar
wangqinghua committed
<nz-modal [nzWidth]="1080" [(nzVisible)]="isShow" [nzTitle]="title" (nzOnCancel)="handleEditCancel()"
          (nzOnOk)="handEditleOk()" [nzOkLoading]="isOkLoading">
    <nz-tabset [nzType]="'card'" [(nzSelectedIndex)]="tabNum" (nzSelectedIndexChange)="tabsChange($event)"
               style="padding-bottom: 25px;min-height: 500px">
wangqinghua's avatar
wangqinghua committed
        <nz-tab nzTitle="选定告警目标">
            <div nz-form class="ant-advanced-search-form form-select">
                <nz-form-item>
wangqinghua's avatar
wangqinghua committed
                    <nz-form-label [nzSpan]="4" nzRequired nzFor="hostName">告警名称</nz-form-label>
wangqinghua's avatar
wangqinghua committed
                    <nz-form-control [nzSpan]="14">
wangqinghua's avatar
wangqinghua committed
                        <input type="text" nz-input name="hostName" [(ngModel)]="validateForm.name">
wangqinghua's avatar
wangqinghua committed
                    </nz-form-control>
                </nz-form-item>

wangqinghua's avatar
wangqinghua committed
                <ng-container *ngIf="this.title != '添加告警推送' && this.title != '编辑告警推送'">
wangqinghua's avatar
wangqinghua committed
                    <nz-form-item>
                        <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"
                                         [nzAsyncData]="true"
                                         [nzCheckStrictly]="true"
wangqinghua's avatar
wangqinghua committed
                                         (nzExpandChange)="mouseAction('expand',$event)">
wangqinghua's avatar
wangqinghua committed
                                    <ng-template #nzTreeTemplate let-node>
wangqinghua's avatar
wangqinghua committed
                                        <span class="custom-node" draggable="true" aria-grabbed="true"
                                              [class.active]="node.isSelected">
                                            <label [(ngModel)]="node.isChecked" nz-checkbox *ngIf="node.level == 0"
                                                   (click)="selectCheckTreeGroup(node)"> {{node.title}}</label>
                                            <label [(ngModel)]="node.isChecked" [nzDisabled]="node.origin.disabled"
                                                   (click)="selectCheckTree(node)" *ngIf="node.level == 1"
                                                   nz-checkbox> {{node.title}}</label>
wangqinghua's avatar
wangqinghua committed
                                        </span>
                                    </ng-template>
wangqinghua's avatar
wangqinghua committed
                                </nz-tree>
                            </div>
                        </nz-form-control>
                    </nz-form-item>
                </ng-container>
wangqinghua's avatar
wangqinghua committed

                <nz-form-item>
wangqinghua's avatar
wangqinghua committed
                    <nz-form-label [nzSpan]="4" nzRequired nzFor="groupIds">告警分组</nz-form-label>
wangqinghua's avatar
wangqinghua committed
                    <nz-form-control [nzSpan]="14">
wangqinghua's avatar
wangqinghua committed
                        <nz-select name="groupIds" nzPlaceHolder="告警分组" [(ngModel)]="validateForm.alertGroupId">
wangqinghua's avatar
wangqinghua committed
                            <ng-container *ngFor="let item of groupList;let i = index;">
wangqinghua's avatar
wangqinghua committed
                                <nz-option [nzLabel]="item.name" [nzValue]="item.id"></nz-option>
wangqinghua's avatar
wangqinghua committed
                            </ng-container>
wangqinghua's avatar
wangqinghua committed
                        </nz-select>
                    </nz-form-control>
                </nz-form-item>

wangqinghua's avatar
wangqinghua committed
                <!--<nz-form-item>-->
wangqinghua's avatar
wangqinghua committed
                <!--<nz-form-label [nzSpan]="4" nzFor="serviceid">告警描述</nz-form-label>-->
                <!--<nz-form-control [nzSpan]="14">-->
                <!--<textarea nz-input placeholder="告警描述" [nzAutosize]="{ minRows: 4, maxRows: 4 }"></textarea>-->
                <!--</nz-form-control>-->
wangqinghua's avatar
wangqinghua committed
                <!--</nz-form-item>-->
wangqinghua's avatar
wangqinghua committed
            </div>
        </nz-tab>

        <nz-tab nzTitle="选择发送策略">
            <div nz-form class="ant-advanced-search-form form-select">
                <nz-form-item>
wangqinghua's avatar
wangqinghua committed
                    <nz-form-label [nzSpan]="4" nzRequired nzFor="host">监测点状态</nz-form-label>
wangqinghua's avatar
wangqinghua committed
                    <nz-form-control [nzSpan]="14">
wangqinghua's avatar
wangqinghua committed
                        <label nz-checkbox [(ngModel)]="validateForm.serious">严重</label>
                        <label nz-checkbox [(ngModel)]="validateForm.warn">告警</label>
wangqinghua's avatar
wangqinghua committed
                    </nz-form-control>
                </nz-form-item>

wangqinghua's avatar
wangqinghua committed
                <!--<nz-form-item>-->
wangqinghua's avatar
wangqinghua committed
                <!--<nz-form-label [nzSpan]="4" nzRequired nzFor="host1">时间条件</nz-form-label>-->
                <!--<nz-form-control [nzSpan]="20">-->
                <!--<div nz-row [nzGutter]="12">-->
                <!--<nz-form-control nz-col [nzSpan]="3">-->
                <!--<nz-select name="main">-->
                <!--<nz-option nzValue="1" nzLabel="属于"></nz-option>-->
                <!--<nz-option nzValue="0" nzLabel="不属于"></nz-option>-->
                <!--</nz-select>-->
                <!--</nz-form-control>-->
                <!--<nz-form-control nz-col [nzSpan]="4">-->
                <!--<nz-select name="type" nzPlaceHolder="日期">-->
                <!--<nz-option nzValue="1" nzLabel="周一"></nz-option>-->
                <!--<nz-option nzValue="2" nzLabel="周二"></nz-option>-->
                <!--<nz-option nzValue="3" nzLabel="周三"></nz-option>-->
                <!--<nz-option nzValue="4" nzLabel="周四"></nz-option>-->
                <!--<nz-option nzValue="5" nzLabel="周五"></nz-option>-->
                <!--<nz-option nzValue="6" nzLabel="周六"></nz-option>-->
                <!--<nz-option nzValue="7" nzLabel="周日"></nz-option>-->
                <!--</nz-select>-->
                <!--</nz-form-control>-->
                <!--<nz-form-control nz-col [nzSpan]="1">-->
                <!--~-->
                <!--</nz-form-control>-->
                <!--<nz-form-control nz-col [nzSpan]="4">-->
                <!--<nz-select name="type" nzPlaceHolder="日期">-->
                <!--<nz-option nzValue="1" nzLabel="周一"></nz-option>-->
                <!--<nz-option nzValue="2" nzLabel="周二"></nz-option>-->
                <!--<nz-option nzValue="3" nzLabel="周三"></nz-option>-->
                <!--<nz-option nzValue="4" nzLabel="周四"></nz-option>-->
                <!--<nz-option nzValue="5" nzLabel="周五"></nz-option>-->
                <!--<nz-option nzValue="6" nzLabel="周六"></nz-option>-->
                <!--<nz-option nzValue="7" nzLabel="周日"></nz-option>-->
                <!--</nz-select>-->
                <!--</nz-form-control>-->
                <!--<nz-form-control nz-col [nzSpan]="3">-->
                <!--<input type="text" nz-input name="port">-->
                <!--</nz-form-control>-->
                <!--<nz-form-control nz-col [nzSpan]="1">-->
                <!--~-->
                <!--</nz-form-control>-->
                <!--<nz-form-control nz-col [nzSpan]="3">-->
                <!--<input type="text" nz-input name="port">-->
                <!--</nz-form-control>-->
                <!--<nz-form-control nz-col [nzSpan]="2">-->
                <!--<span class="cursor">X</span>-->
                <!--</nz-form-control>-->
                <!--</div>-->
                <!--<button nz-button nzType="default">添加</button>-->
                <!--</nz-form-control>-->
wangqinghua's avatar
wangqinghua committed
                <!--</nz-form-item>-->
wangqinghua's avatar
wangqinghua committed


wangqinghua's avatar
wangqinghua committed
                <!--<nz-form-item>-->
wangqinghua's avatar
wangqinghua committed
                <!--<nz-form-label [nzSpan]="4" nzFor="serviceid">过滤条件</nz-form-label>-->
                <!--<nz-form-control [nzSpan]="14">-->
                <!--<nz-radio-group>-->
                <!--<label nz-radio nzValue="1">-->
                <!--当事件连续发生<input type="text" nz-input style="width: 100px; margin-left: 10px;">时,发送告警,-->
                <!--再没每<input type="text" nz-input style="width: 100px; margin-left: 10px;">次发送一次告警-->
                <!--</label>-->
                <!--<label nz-radio nzValue="2">-->
                <!--在<input type="text" nz-input style="width: 100px; margin-left: 10px;">分钟内,-->
                <!--有<input type="text" nz-input style="width: 100px; margin-left: 10px;">次同样状态事件发送告警-->
                <!--</label>-->
                <!--</nz-radio-group>-->
                <!--<label nz-checkbox>-->
                <!--当事件连续发生<input type="text" nz-input style="width: 100px; margin-left: 10px;">次后,停止发送告警-->
                <!--</label>-->
                <!--<label nz-checkbox>-->
                <!--当发送告警监测点恢复正常时,发送一次告警-->
                <!--</label>-->
                <!--</nz-form-control>-->
wangqinghua's avatar
wangqinghua committed
                <!--</nz-form-item>-->
wangqinghua's avatar
wangqinghua committed

wangqinghua's avatar
wangqinghua committed
                <nz-form-item>
                    <nz-form-label [nzSpan]="4" nzFor="serviceid">生成事件</nz-form-label>
                    <nz-form-control [nzSpan]="14">
wangqinghua's avatar
wangqinghua committed
                        <nz-radio-group [(ngModel)]="isEvent">
wangqinghua's avatar
wangqinghua committed
                            <label nz-radio nzValue="1"></label>
                            <label nz-radio nzValue="2"></label>
                        </nz-radio-group>
                    </nz-form-control>
                </nz-form-item>
wangqinghua's avatar
wangqinghua committed

wangqinghua's avatar
wangqinghua committed
                <ng-container *ngIf="isEvent == '1'">
                    <nz-form-item>
wangqinghua's avatar
wangqinghua committed
                        <nz-form-label [nzSpan]="4" nzRequired nzFor="hostName">事件标题</nz-form-label>
                        <nz-form-control [nzSpan]="14">
                            <input type="text" nz-input name="hostName" [(ngModel)]="validateForm.event.title">
                        </nz-form-control>
                    </nz-form-item>
                    <nz-form-item>
                        <nz-form-label [nzSpan]="4" nzRequired nzFor="serviceid">事件分类</nz-form-label>
wangqinghua's avatar
wangqinghua committed
                        <nz-form-control [nzSpan]="14">
wangqinghua's avatar
wangqinghua committed
                            <nz-select name="serviceid" nzPlaceHolder="事件分类"
                                       [(ngModel)]="validateForm.event.eventTypeId">
wangqinghua's avatar
wangqinghua committed
                                <ng-container *ngFor="let item of eventTypeList">
                                    <nz-option [nzLabel]="item.name" [nzValue]="item.id"></nz-option>
                                </ng-container>
                            </nz-select>
                        </nz-form-control>
                    </nz-form-item>
wangqinghua's avatar
wangqinghua committed

wangqinghua's avatar
wangqinghua committed
                    <nz-form-item>
wangqinghua's avatar
wangqinghua committed
                        <nz-form-label [nzSpan]="4" nzRequired nzFor="serviceid">事件负责人</nz-form-label>
wangqinghua's avatar
wangqinghua committed
                        <nz-form-control [nzSpan]="14">
                            <button (click)="selectPerson()" nz-button><span>选择</span></button>
                            <ng-container *ngFor="let item of operatorList;let i = index;">
wangqinghua's avatar
wangqinghua committed
                                <span style="margin-left: 10px">{{item.username}}</span><span class="main-color cursor"
                                                                                              style="margin-left: 5px"
                                                                                              (click)="deleteOperator(i)">X</span>
wangqinghua's avatar
wangqinghua committed
                            </ng-container>
                        </nz-form-control>
                    </nz-form-item>
                </ng-container>
wangqinghua's avatar
wangqinghua committed
            </div>
        </nz-tab>

        <nz-tab nzTitle="选择发送方式">
            <div nz-form class="ant-advanced-search-form form-select">
wangqinghua's avatar
wangqinghua committed
                <nz-form-item>
                    <div nz-row>
                        <nz-form-label [nzSpan]="4">发送对象</nz-form-label>
                        <nz-form-control nz-col [nzSpan]="14">
                            <button nz-button nzType="primary" nzSize="small" style="margin-right: 10px"
                                    (click)="addOption()">添加发送对象
                            </button>
                        </nz-form-control>
                    </div>
                    <div nz-row [nzGutter]="12" *ngFor="let item of sendInfoList;let i = index;">
                        <nz-form-control nz-col [nzSpan]="4"></nz-form-control>
                        <nz-form-control nz-col [nzSpan]="3">
                            <nz-select name="templates" style="width: 100%" [(ngModel)]="item.mediaType"
                                       nzPlaceHolder="选择发送方式">
                                <ng-container *ngFor="let option of sendOption">
                                    <nz-option [nzLabel]="option.description"
                                               [nzValue]="option.mediatypeid"></nz-option>
                                </ng-container>
                            </nz-select>
                        </nz-form-control>
                        <nz-form-control nz-col [nzSpan]="5">
                            <input type="text" placeholder="手机号码或邮箱" nz-input name="value"
                                   [(ngModel)]="item.receiver">
                        </nz-form-control>
                        <nz-form-control nz-col [nzSpan]="2">
                            <button nz-button nzType="primary" (click)="deleteOption(i)"><i
                                    class="anticon anticon-close-circle-o color-fff"></i></button>
                        </nz-form-control>
                    </div>
wangqinghua's avatar
wangqinghua committed
                </nz-form-item>
                <nz-form-item>
wangqinghua's avatar
wangqinghua committed
                    <nz-form-label [nzSpan]="4" nzRequired nzFor="def_longdata">发送信息</nz-form-label>
wangqinghua's avatar
wangqinghua committed
                    <nz-form-control [nzSpan]="14">
wangqinghua's avatar
wangqinghua committed
                        <textarea nz-input placeholder="发送信息" [nzAutosize]="{ minRows: 2, maxRows: 6 }"
                                  [(ngModel)]="validateForm.def_longdata"></textarea>
wangqinghua's avatar
wangqinghua committed
                    </nz-form-control>
                </nz-form-item>

                <nz-form-item>
wangqinghua's avatar
wangqinghua committed
                    <nz-form-label [nzSpan]="4" nzFor="serviceid">恢复信息</nz-form-label>
wangqinghua's avatar
wangqinghua committed
                    <nz-form-control [nzSpan]="14">
wangqinghua's avatar
wangqinghua committed
                        <label nz-checkbox [(ngModel)]="selectModal"></label>
wangqinghua's avatar
wangqinghua committed
                    </nz-form-control>
                </nz-form-item>

wangqinghua's avatar
wangqinghua committed
                <ng-container *ngIf="selectModal">
                    <nz-form-item>
                        <nz-form-label [nzSpan]="4" nzRequired nzFor="serviceid">恢复信息</nz-form-label>
                        <nz-form-control [nzSpan]="14">
wangqinghua's avatar
wangqinghua committed
                            <textarea nz-input nzPlaceholder="恢复信息" [nzAutosize]="{ minRows: 4, maxRows: 4 }"
                                      [(ngModel)]="validateForm.r_longdata"></textarea>
wangqinghua's avatar
wangqinghua committed
                        </nz-form-control>
                    </nz-form-item>
                </ng-container>
wangqinghua's avatar
wangqinghua committed
            </div>
        </nz-tab>
    </nz-tabset>
</nz-modal>
wangqinghua's avatar
wangqinghua committed
<!--选择负责人-->
<smart-select-person #smartSelectPerson (done)="getUser($event)"></smart-select-person>