Sinopec-Anxin/src/app/pages/today-warning/get-out-of-line-details/get-out-of-line-details.component.html

<div class="box">
    <div class="titlebox">
        <div class="title">
            <div (click)="contentType('img')" [ngClass]="{'selected': selectedType == 'img'}">
                预警截图
                <div class="border"></div>
            </div>
            <div *ngIf="data.violation && data.violation.violationType != '设备监测' && data.violation.violationType != '证照资质'"
                (click)="contentType('video')" [ngClass]="{'selected': selectedType == 'video'}">
                预警视频
                <div class="border"></div>
            </div>
        </div>
    </div>
    <div class="details">
        预警详情：{{details}}
    </div>
    <div class="content">
        <div *ngIf="selectedType == 'img'" class="imgbox">
            <ng-container *ngIf="imgUrl; else elseTemplate">
                <ng-container *ngIf="isImage; else elseTemplate2">
                    <img [src]="imgUrl" alt="">
                </ng-container>
                <ng-template #elseTemplate2>
                    <iframe width="100%" height="100%" [src]="fileUrl" frameborder="0"></iframe>
                </ng-template>
            </ng-container>
            <ng-template #elseTemplate>
                暂无图片
            </ng-template>
        </div>
        <div *ngIf="selectedType == 'video'" class="vediobox">
            <ng-container *ngIf="vedioUrl; else elseTemplate3">
                <video crossorign="anonymous" controls style="width: 100%;height: 100%;"
                    src="http://121.36.37.70:8906/api/Objects/sinochemweb/video_vr/1669958550_3_192_168_110_72.mp4?directView=true"></video>
            </ng-container>
            <ng-template #elseTemplate3>
                暂无视频
            </ng-template>
        </div>
    </div>
    <p style="margin-bottom: 0px;margin-top: 3px;box-sizing: border-box;padding: 0 12px;"
        *ngIf="data.appealStatus == 3 && data.handleStateStr != '已处置'">
        <span style="margin-right: 10px;">驳回人:{{data.appealLog.auditUser.name}}</span>
        <span style="margin-right: 10px;">驳回时间:{{data.appealLog.auditTime | date:"yyyy-MM-dd HH:mm:ss"}}</span>
        <span>驳回说明:{{data.appealLog.rejectReason}}</span>
    </p>
    <!-- 只有非证照预警才可以处置 或者 申诉-->
    <div class="disposebox" *ngIf="!isLicenseWarning">
        <div class="title">
            <span>处置内容</span>
            <ng-container *ngIf="!data.positive; else elseTemplate">
                <span *ngIf="data.appealStatus == 5" style="color: #4BFFD4;">申诉成功 ( 处理人 : {{data.handleUserName}}&nbsp;
                    处理时间 : {{data.lastModificationTime |
                    date:"yyyy-MM-dd HH:mm:ss"}} ) </span>
                <span style="color: #4BFFD4;cursor: default;">已进行误报处置</span>
            </ng-container>
            <ng-template #elseTemplate>
                <div class="btn">
                    <span *ngIf="!data.handleTime && data.appealStatus ==1 && isSubmit"
                        style="color: #FF4B65;cursor: pointer;margin-right: 20px;" (click)="Unappeal()">申诉撤销</span>
                    <span
                        *ngIf="!data.handleTime && (data.appealStatus == 0 || data.appealStatus == 3 || data.appealStatus == 4) && isSubmit"
                        style="color: #FF4B65;cursor: pointer;margin-right: 20px;" (click)="appeal()">申诉</span>
                    <nz-modal [(nzVisible)]="isAppeal" nzTitle="申诉原因" (nzOnOk)="handleOk()"
                        (nzOnCancel)="handleCancel()">

                        <ng-container *nzModalContent>
                            <textarea nz-input rows="2" placeholder="请输入申诉原因" name="appeal"
                                [(ngModel)]="appealValue"></textarea>
                            <div class="appealUploadbox">
                                <div class="title">
                                    上传附件:
                                </div>
                                <div class="btn">
                                    <button nz-button [nzLoading]="isLoadingSave">
                                        <span nz-icon nzType="upload"></span>上传
                                    </button>
                                    <input type="file" name="" id="" (change)="filechange($event)"
                                        *ngIf="!isLoadingSave">
                                    <ul>
                                        <li *ngFor="let item of fileList;let key = index">
                                            <span class="filename" (click)="lookfile(item)">{{item | fileName}}</span>
                                            <span (click)="delete(fileList,key)">x</span>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </ng-container>

                    </nz-modal>
                    <span
                        *ngIf="isMisinformation &&  (data.appealStatus == 0 || data.appealStatus == 3 || data.appealStatus == 4)"
                        style="color: #FF4B65;cursor: pointer;margin-right: 20px;" (click)="misinformation()">误报</span>
                    <span
                        *ngIf="!data.handleTime && isSubmit && (data.appealStatus == 0 || data.appealStatus == 3 || data.appealStatus == 4)"
                        style="
                        color: #36A2FF;cursor: pointer;" (click)="submit()">提交</span>
                    <span *ngIf="data.handleTime" style="color: #4BFFD4;cursor: default;">已处置</span>
                    <span *ngIf="data.appealStatus == 1" style="color: #4BFFD4;cursor: default;">申诉中</span>
                </div>
            </ng-template>
        </div>

        <div class="disposeContent">
            <textarea
                *ngIf="!data.handleTime && isSubmit && (data.appealStatus == 0 || data.appealStatus == 3 || data.appealStatus == 4)"
                [(ngModel)]="content"></textarea>
            <span *ngIf="data.handleTime">{{content}}</span>
        </div>
        <div class="disposeTime" *ngIf="data.handleTime">
            <span style="margin-right: 12px;">
                处置人：{{data.handleUserName}}
            </span>
            <span>
                处置时间：{{data.handleTime|date:"yyyy-MM-dd HH:mm:ss"}}
            </span>
        </div>
    </div>
</div>