|
|
|
|
<!-- <p>月度任务总览</p> -->
|
|
|
|
|
<div class="box">
|
|
|
|
|
<div class="timebox">
|
|
|
|
|
<nz-select ngModel="2022">
|
|
|
|
|
<nz-option nzValue="2021" nzLabel="2021年"></nz-option>
|
|
|
|
|
<nz-option nzValue="2022" nzLabel="2022年"></nz-option>
|
|
|
|
|
</nz-select>
|
|
|
|
|
<div *ngFor="let item of months" class="monthbtn" (click)="selectMonth(item)"
|
|
|
|
|
[ngClass]="{'selectedMonth': item.name == selectedMonth}">
|
|
|
|
|
{{item.name}}
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div style="flex: 1;overflow-y: auto;">
|
|
|
|
|
<!-- 上部仪表盘 -->
|
|
|
|
|
<div class="instrumentpanelbox">
|
|
|
|
|
<div class="instrumentpanelheader">
|
|
|
|
|
<span><img src="../../../../assets/images/icon/task.png" alt=""> 上级任务指标</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="instrumentpanel">
|
|
|
|
|
<div class="instrumentpanelitem instrumentpanelitemclose" *ngFor="let item of cardData">
|
|
|
|
|
<div class="itemone" *ngIf="!item.isDetails">
|
|
|
|
|
<div class="instrumentpanelitemleft">
|
|
|
|
|
<div class="panelheadername" [style]="'background:'+ item.background">
|
|
|
|
|
<img [src]="'../../../../assets/images/icon/'+ item.icon" alt="">
|
|
|
|
|
{{item.name}}
|
|
|
|
|
</div>
|
|
|
|
|
<div class="tasknum">
|
|
|
|
|
<p>
|
|
|
|
|
<span style="margin-right: 6px;">任务分配</span>
|
|
|
|
|
<i (click)="openDetails(item,true)"
|
|
|
|
|
style="vertical-align: text-top;cursor: pointer;" nz-icon nzType="right-circle"
|
|
|
|
|
nzTheme="outline"></i>
|
|
|
|
|
</p>
|
|
|
|
|
<p style="font-weight: 900;font-size: 36px;text-align: left;">5/9</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="jindu">
|
|
|
|
|
<p>
|
|
|
|
|
<span>完成率</span>
|
|
|
|
|
<span>60%</span>
|
|
|
|
|
</p>
|
|
|
|
|
<nz-progress style="width: 100%;" [nzPercent]="75" nzStrokeColor="#42B983"
|
|
|
|
|
[nzShowInfo]="false"></nz-progress>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="itemtwo" *ngIf="item.isDetails">
|
|
|
|
|
<p class="itemtwotitle">
|
|
|
|
|
<span>{{item.name}}</span>
|
|
|
|
|
<span class="back" (click)="openDetails(item,false)"><i nz-icon nzType="rollback"
|
|
|
|
|
nzTheme="outline"></i>返回</span>
|
|
|
|
|
</p>
|
|
|
|
|
<div class="itemtwocontent">
|
|
|
|
|
<div class="itemtwocontentitem">
|
|
|
|
|
<p class="itemtwocontentitemp1">
|
|
|
|
|
<span class="itemtwocontentitemp1name">济南历下森豪室内娱乐场</span>
|
|
|
|
|
</p>
|
|
|
|
|
<p>
|
|
|
|
|
<span class="green" style="margin-right: 12px;">已分配</span>
|
|
|
|
|
<span class="green">已检查</span>
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 下级任务申请 -->
|
|
|
|
|
<div class="taskaudit">
|
|
|
|
|
<div class="taskauditheader">
|
|
|
|
|
<span><img src="../../../../assets/images/icon/task.png" alt=""> 下级任务申请</span>
|
|
|
|
|
<span (click)="istaskauditexpand()" class="expand blue">
|
|
|
|
|
{{istaskauditExpanded ? '收起' :'展开'}}
|
|
|
|
|
<i nz-icon [nzType]="istaskauditExpanded ? 'down' : 'up'" nzTheme="outline"></i>
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- 熟悉演练任务 -->
|
|
|
|
|
<div class="shuxibox" *ngIf="istaskauditExpanded">
|
|
|
|
|
<div class="header">
|
|
|
|
|
<span>熟悉演练任务</span>
|
|
|
|
|
<span (click)="expand(shuxiTaskData)" class="expand blue">
|
|
|
|
|
{{shuxiTaskData.isExpand ? '收起' :'展开'}}
|
|
|
|
|
<i nz-icon [nzType]="shuxiTaskData.isExpand ? 'down' : 'up'" nzTheme="outline"></i>
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="content" *ngIf="shuxiTaskData.isExpand">
|
|
|
|
|
<div class="card redcard">
|
|
|
|
|
<div class="unitname">
|
|
|
|
|
<img src="../../../../assets/images/icon/unit.png" alt="">
|
|
|
|
|
<span>上海雅特酒店管理有限公司济南泺文路分公司</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="info">
|
|
|
|
|
<span>
|
|
|
|
|
<img src="../../../../assets/images/icon/main.png" alt="">
|
|
|
|
|
未分配
|
|
|
|
|
</span>
|
|
|
|
|
<span>
|
|
|
|
|
<img src="../../../../assets/images/icon/assist.png" alt="">
|
|
|
|
|
未分配
|
|
|
|
|
</span>
|
|
|
|
|
<span class="blue">分配</span>
|
|
|
|
|
<span>|</span>
|
|
|
|
|
<span>申请人: 历下区A消防救援站</span>
|
|
|
|
|
<span class="blue">修改</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="btn">
|
|
|
|
|
<button nz-button style="background: #42B983;color: white;">同意</button>
|
|
|
|
|
<button nz-button style="background: #FF0000;color: white;margin-left: 20px;">驳回</button>
|
|
|
|
|
</div>
|
|
|
|
|
<img class="auditimg" src="../../../../assets/images/icon/reject.png" alt="">
|
|
|
|
|
<!-- <img class="auditimg" src="../../../../assets/images/icon/agree.png" alt=""> -->
|
|
|
|
|
</div>
|
|
|
|
|
<div class="card greencard">
|
|
|
|
|
<div class="unitname">
|
|
|
|
|
<img src="../../../../assets/images/icon/unit.png" alt="">
|
|
|
|
|
<span>上海雅特酒店管理有限公司济南泺文路分公司</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="info">
|
|
|
|
|
<span>
|
|
|
|
|
<img src="../../../../assets/images/icon/main.png" alt="">
|
|
|
|
|
未分配
|
|
|
|
|
</span>
|
|
|
|
|
<span>
|
|
|
|
|
<img src="../../../../assets/images/icon/assist.png" alt="">
|
|
|
|
|
未分配
|
|
|
|
|
</span>
|
|
|
|
|
<span class="blue">分配</span>
|
|
|
|
|
<span>|</span>
|
|
|
|
|
<span>申请人: 历下区A消防救援站</span>
|
|
|
|
|
<span class="blue">修改</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="btn">
|
|
|
|
|
<button nz-button style="background: #42B983;color: white;">同意</button>
|
|
|
|
|
<button nz-button style="background: #FF0000;color: white;margin-left: 20px;">驳回</button>
|
|
|
|
|
</div>
|
|
|
|
|
<img class="auditimg" src="../../../../assets/images/icon/reject.png" alt="">
|
|
|
|
|
<!-- <img class="auditimg" src="../../../../assets/images/icon/agree.png" alt=""> -->
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- 联络指导任务 -->
|
|
|
|
|
<div class="zhidaobox" *ngIf="istaskauditExpanded">
|
|
|
|
|
<div class="header">
|
|
|
|
|
<span>联络指导任务</span>
|
|
|
|
|
<span (click)="expand(zhidaoTaskData)" class="expand blue">
|
|
|
|
|
{{zhidaoTaskData.isExpand ? '收起' :'展开'}}
|
|
|
|
|
<i nz-icon [nzType]="zhidaoTaskData.isExpand ? 'down' : 'up'" nzTheme="outline"></i>
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="content" *ngIf="zhidaoTaskData.isExpand">
|
|
|
|
|
<!-- <div class="card redcard">
|
|
|
|
|
<div class="unitname">
|
|
|
|
|
<img src="../../../../assets/images/icon/unit.png" alt="">
|
|
|
|
|
<span>上海雅特酒店管理有限公司济南泺文路分公司</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="info">
|
|
|
|
|
<span>
|
|
|
|
|
<img src="../../../../assets/images/icon/main.png" alt="">
|
|
|
|
|
未分配
|
|
|
|
|
</span>
|
|
|
|
|
<span>
|
|
|
|
|
<img src="../../../../assets/images/icon/assist.png" alt="">
|
|
|
|
|
未分配
|
|
|
|
|
</span>
|
|
|
|
|
<span class="blue">分配</span>
|
|
|
|
|
<span>|</span>
|
|
|
|
|
<span>申请人: 历下区A消防救援站</span>
|
|
|
|
|
<span class="blue">修改</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="btn">
|
|
|
|
|
<button nz-button style="background: #42B983;color: white;">同意</button>
|
|
|
|
|
<button nz-button style="background: #FF0000;color: white;margin-left: 20px;">驳回</button>
|
|
|
|
|
</div>
|
|
|
|
|
<img class="auditimg" src="../../../../assets/images/icon/reject.png" alt="">
|
|
|
|
|
<img class="auditimg" src="../../../../assets/images/icon/agree.png" alt="">
|
|
|
|
|
</div> -->
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- 本级部署 -->
|
|
|
|
|
<div class="deploybox">
|
|
|
|
|
<div class="deployboxheader">
|
|
|
|
|
<span><img src="../../../../assets/images/icon/task0.png" alt=""> 本级部署</span>
|
|
|
|
|
<span (click)="isdeployboxexpand()" class="expand blue">
|
|
|
|
|
{{isdeployboxExpanded ? '收起' :'展开'}}
|
|
|
|
|
<i nz-icon [nzType]="isdeployboxExpanded ? 'down' : 'up'" nzTheme="outline"></i>
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="deploycontent" *ngIf="isdeployboxExpanded">
|
|
|
|
|
<div class="deploycontentitem">
|
|
|
|
|
<div class="title">
|
|
|
|
|
月计划统计
|
|
|
|
|
</div>
|
|
|
|
|
<div class="details">
|
|
|
|
|
<div class="detailsname">
|
|
|
|
|
月计划总数
|
|
|
|
|
<span style="font-weight: 18;font-size: 26px;margin-left: 10px;">15</span>
|
|
|
|
|
</div>
|
|
|
|
|
<span>已完成 15</span>
|
|
|
|
|
<span class="progresssquare">
|
|
|
|
|
<span>完成率</span>
|
|
|
|
|
<nz-progress nzStrokeLinecap="square" style="width: 70%;margin-bottom: 3px;"
|
|
|
|
|
[nzPercent]="75" nzStrokeColor="#42B983" [nzShowInfo]="false" [nzStrokeWidth]="18">
|
|
|
|
|
</nz-progress>
|
|
|
|
|
<span>75%</span>
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="deploycontentitem">
|
|
|
|
|
<div class="title">
|
|
|
|
|
周计划统计
|
|
|
|
|
</div>
|
|
|
|
|
<div class="details">
|
|
|
|
|
<div class="detailsname">
|
|
|
|
|
周计划总数
|
|
|
|
|
<span style="font-weight: 18;font-size: 26px;margin-left: 10px;">15</span>
|
|
|
|
|
</div>
|
|
|
|
|
<span>已完成 15</span>
|
|
|
|
|
<span class="progresssquare">
|
|
|
|
|
<span>完成率</span>
|
|
|
|
|
<nz-progress nzStrokeLinecap="square" style="width: 70%;margin-bottom: 3px;"
|
|
|
|
|
[nzPercent]="75" nzStrokeColor="#42B983" [nzShowInfo]="false" [nzStrokeWidth]="18">
|
|
|
|
|
</nz-progress>
|
|
|
|
|
<span>75%</span>
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 救援站列表 -->
|
|
|
|
|
<div class="stationcardlistbox">
|
|
|
|
|
<div class="stationcardlistitembox" *ngFor="let item of stationData">
|
|
|
|
|
<div class="stationcardlistitem">
|
|
|
|
|
<div class="header">
|
|
|
|
|
<span style="width: 16%;">
|
|
|
|
|
<img src="../../../../assets//images/icon/station.png" alt="">
|
|
|
|
|
{{item.name}}
|
|
|
|
|
</span>
|
|
|
|
|
<span style="width: 8%;">单位总数: 7/8</span>
|
|
|
|
|
<div style="width: 66%;" class="progress progresssquare">
|
|
|
|
|
<span>完成进度</span>
|
|
|
|
|
<nz-progress nzStrokeLinecap="square" nzStrokeWidth="16" nzStrokeColor="#42B983"
|
|
|
|
|
[nzPercent]="30"></nz-progress>
|
|
|
|
|
</div>
|
|
|
|
|
<button nz-button nzType="primary">任务下派</button>
|
|
|
|
|
<span (click)="expandcarditem(item)" class="expand blue">
|
|
|
|
|
{{item.isExpand ? '收起' :'展开'}}
|
|
|
|
|
<i nz-icon [nzType]="item.isExpand ? 'down' : 'up'" nzTheme="outline"></i>
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="maincontent" *ngIf="item.isExpand">
|
|
|
|
|
<div class="maincontentitem">
|
|
|
|
|
<div class="maincontentitemleft">
|
|
|
|
|
<div class="panelheadername panelheadernameor">
|
|
|
|
|
<img src="'../../../../assets/images/icon/huodong.png" alt="">
|
|
|
|
|
重大活动
|
|
|
|
|
</div>
|
|
|
|
|
<div class="num">
|
|
|
|
|
<div class="round" style="background: #2C4DC0;"></div>
|
|
|
|
|
<span class="word">已分配</span>
|
|
|
|
|
<span class="boldspan">1</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="num">
|
|
|
|
|
<div class="round" style="background: #42B983;"></div>
|
|
|
|
|
<span class="word">已完成</span>
|
|
|
|
|
<span class="boldspan">1</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="maincontentitemright">
|
|
|
|
|
<div class="maincontentitemrightitem">
|
|
|
|
|
<div class="flexcol namebox">
|
|
|
|
|
<span>
|
|
|
|
|
尬粒酒店管理有限公司济南泺文路分公司
|
|
|
|
|
</span>
|
|
|
|
|
<span>
|
|
|
|
|
单位名称
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="flexcol">
|
|
|
|
|
<span>
|
|
|
|
|
重点单位
|
|
|
|
|
</span>
|
|
|
|
|
<span>
|
|
|
|
|
级别
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="flexcol">
|
|
|
|
|
<span>
|
|
|
|
|
历下区A消防救援站
|
|
|
|
|
</span>
|
|
|
|
|
<span>
|
|
|
|
|
责任机构
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="flexcol">
|
|
|
|
|
<span>
|
|
|
|
|
历下区B消防救援站
|
|
|
|
|
</span>
|
|
|
|
|
<span>
|
|
|
|
|
协助机构
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="flexcol">
|
|
|
|
|
<span>
|
|
|
|
|
宣传
|
|
|
|
|
</span>
|
|
|
|
|
<span>
|
|
|
|
|
同步工作
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="flexcol progressbox progresssquare">
|
|
|
|
|
<span>
|
|
|
|
|
<nz-progress style="width: 200px;" nzStrokeLinecap="square"
|
|
|
|
|
nzStrokeWidth="16" nzStrokeColor="#42B983" [nzPercent]="30">
|
|
|
|
|
</nz-progress>
|
|
|
|
|
</span>
|
|
|
|
|
<span>
|
|
|
|
|
进度
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="btnbox">
|
|
|
|
|
<button nz-button nzType="primary">提交审核</button>
|
|
|
|
|
<button style="margin-left: 12px;" nz-button nzType="primary">取消</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="maincontentitemrightitem">
|
|
|
|
|
<div class="flexcol namebox">
|
|
|
|
|
<span>
|
|
|
|
|
尬粒酒店管理有限公司济南泺文路分公司
|
|
|
|
|
</span>
|
|
|
|
|
<span>
|
|
|
|
|
单位名称
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="flexcol">
|
|
|
|
|
<span>
|
|
|
|
|
重点单位
|
|
|
|
|
</span>
|
|
|
|
|
<span>
|
|
|
|
|
级别
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="flexcol">
|
|
|
|
|
<span>
|
|
|
|
|
历下区A消防救援站
|
|
|
|
|
</span>
|
|
|
|
|
<span>
|
|
|
|
|
责任机构
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="flexcol">
|
|
|
|
|
<span>
|
|
|
|
|
历下区B消防救援站
|
|
|
|
|
</span>
|
|
|
|
|
<span>
|
|
|
|
|
协助机构
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="flexcol">
|
|
|
|
|
<span>
|
|
|
|
|
宣传
|
|
|
|
|
</span>
|
|
|
|
|
<span>
|
|
|
|
|
同步工作
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="flexcol progressbox progresssquare">
|
|
|
|
|
<span>
|
|
|
|
|
<nz-progress style="width: 200px;" nzStrokeLinecap="square"
|
|
|
|
|
nzStrokeWidth="16" nzStrokeColor="#42B983" [nzPercent]="30">
|
|
|
|
|
</nz-progress>
|
|
|
|
|
</span>
|
|
|
|
|
<span>
|
|
|
|
|
进度
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="btnbox">
|
|
|
|
|
<button nz-button nzType="primary">提交审核</button>
|
|
|
|
|
<button style="margin-left: 12px;" nz-button nzType="primary">取消</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- -->
|
|
|
|
|
<div class="cutoffrule"></div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
