<nz-modal [nzMaskClosable]="false" [nzWidth]="1080" [(nzVisible)]="modal.isVisible" [nzTitle]="modal.title" (nzOnCancel)="handleCancel()"
          (nzOnOk)="handleOk()" [nzFooter]="null" [nzOkLoading]="modal.isOkLoading">
    <div nz-row [nzGutter]="8">
        <div nz-col [nzSpan]="12">
            <nz-card>
                <nz-tabset>
                    <nz-tab nzTitle="预警内容">
                        <div class="margin-bottom-15" nz-row [nzGutter]="8">
                            <div nz-col [nzSpan]="4">预警内容</div>
                            <div nz-col [nzSpan]="8">{{msgObj?.ruleContent}}</div>
                        </div>
                        <div class="margin-bottom-15" nz-row [nzGutter]="8">
                            <div nz-col [nzSpan]="4">预警级别</div>
                            <div nz-col [nzSpan]="8">
                                <span *ngIf="msgObj?.ruleLevel == '1'">一般</span>
                                <span *ngIf="msgObj?.ruleLevel == '9'">严重</span>
                            </div>
                        </div>
                        <div class="margin-bottom-15" nz-row [nzGutter]="8">
                            <div nz-col [nzSpan]="4">预警时间</div>
                            <div nz-col [nzSpan]="12">
                                {{msgObj?.createTime | date:'yyyy-MM-dd HH:mm:ss'}}
                            </div>
                        </div>
                        <div class="margin-bottom-15" nz-row [nzGutter]="8">
                            <div nz-col [nzSpan]="4">触发规则</div>
                            <div nz-col [nzSpan]="8">{{msgObj?.ruleName}}</div>
                        </div>
                        <div class="margin-bottom-15" nz-row [nzGutter]="8">
                            <div nz-col [nzSpan]="4">最新批注</div>
                            <div nz-col [nzSpan]="8">{{msgObj?.newestRemark}}</div>
                        </div>
                    </nz-tab>
                    <nz-tab nzTitle="跟踪信息">
                        <smart-warning-track-info #smartWarningTrackInfo [title]="'跟踪信息'" [msgId]="msgId"></smart-warning-track-info>
                    </nz-tab>
                </nz-tabset>
            </nz-card>
        </div>
        <div nz-col [nzSpan]="12">
            <nz-card>
                <nz-tabset>
                    <nz-tab nzTitle="添加批注">
                        <div>
                            <div class="margin-bottom-15" nz-row [nzGutter]="8">
                                <div nz-col [nzSpan]="4">批注人：</div>
                                <div nz-col [nzSpan]="8">{{msgObj?.verifyUserName}}</div>
                            </div>

                            <nz-form-item>
                                <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="description">最新批注</nz-form-label>
                                <nz-form-control [nzSm]="14" [nzXs]="24">
                                        <textarea nz-input rows="2" [(ngModel)]="newestRemark"
                                                  placeholder="请输入批注"></textarea>
                                </nz-form-control>
                            </nz-form-item>
                            <div class="margin-bottom-15" nz-row [nzGutter]="8">
                                <div nz-col [nzSpan]="4">批注时间：</div>
                                <div nz-col [nzSpan]="8">{{msgObj?.verifyUserName}}</div>
                            </div>
                        </div>
                    </nz-tab>
                </nz-tabset>
            </nz-card>
        </div>
    </div>
    <div class="padding-15-0 text-center">
        <button nz-button [nzLoading]="modal.isOkLoading" (click)="saveNotation()" nzType="primary">保存</button>
        <button nz-button (click)="handleCancel()" nzType="primary">取消</button>
    </div>
</nz-modal>

