You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
334 lines
18 KiB
334 lines
18 KiB
<!-- <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 class="content" cdkScrollable> |
|
<!-- 双随机 --> |
|
<div class="panel"> |
|
<div class="panelheader"> |
|
<div class="panelheaderleft"> |
|
<div class="panelheadername panelheadernameblue"> |
|
<img src="../../../../assets/images/icon/suiji.png" alt=""> |
|
双随机 |
|
</div> |
|
<button nz-button nzType="primary" nz-popover nzPopoverPlacement="bottomLeft" |
|
[nzPopoverContent]="contentTemplate" [nzPopoverTrigger]=null |
|
[nzPopoverVisible]="doubleRandom.isPopover" (click)="isPopover(doubleRandom)">选择单位</button> |
|
<ng-template #contentTemplate> |
|
<div class="selectUnitPopover"> |
|
<div class="popoverTitle"> |
|
<span (click)="popoverMenuSelect(doubleRandom,1)" |
|
[ngClass]="{'selectedspan': doubleRandom.selectedMenu == 1}">单位名称</span> |
|
<span style="margin: 0 10px;">|</span> |
|
<span (click)="popoverMenuSelect(doubleRandom,2)" |
|
[ngClass]="{'selectedspan': doubleRandom.selectedMenu == 2}">组织机构</span> |
|
</div> |
|
<div class="popoverContent" *ngIf="doubleRandom.selectedMenu == 1"> |
|
<div> |
|
<form nz-form (ngSubmit)="submitForm(doubleRandom.search1)"> |
|
<nz-form-item> |
|
<nz-form-control> |
|
<nz-input-group nzPrefixIcon="search"> |
|
<input type="text" [(ngModel)]="doubleRandom.search1" nz-input |
|
placeholder="请输入单位名称" [ngModelOptions]="{standalone: true}" /> |
|
</nz-input-group> |
|
</nz-form-control> |
|
<button style="display: none;" type="submit"></button> |
|
</nz-form-item> |
|
</form> |
|
</div> |
|
<div class="popoverContentitem"> |
|
</div> |
|
</div> |
|
<div class="popoverContent" *ngIf="doubleRandom.selectedMenu == 2"> |
|
<div> |
|
<form nz-form> |
|
<nz-form-item> |
|
<nz-form-control> |
|
<nz-input-group nzPrefixIcon="search"> |
|
<input type="text" [(ngModel)]="doubleRandom.search2" nz-input |
|
placeholder="请输入单位名称" [ngModelOptions]="{standalone: true}" /> |
|
</nz-input-group> |
|
</nz-form-control> |
|
</nz-form-item> |
|
</form> |
|
</div> |
|
<div class="popoverContentitem"> |
|
<nz-tree [nzHideUnMatched]='true' [nzSearchValue]="doubleRandom.search2" |
|
#nzTreeComponent [nzData]="doubleRandom.nodes" [nzTreeTemplate]="nzTreeTemplate" |
|
nzBlockNode [nzExpandedIcon]="multiExpandedIconTpl"> |
|
</nz-tree> |
|
<ng-template #nzTreeTemplate let-node let-origin="origin"> |
|
<div class="nodebox"> |
|
|
|
<span class="name"> |
|
<label *ngIf="node.origin.isGasStation" |
|
[(ngModel)]="node.origin.isChecked" nz-checkbox |
|
(ngModelChange)="orcheckbox(doubleRandom,$event,node)"></label> |
|
{{ node.title }} |
|
</span> |
|
</div> |
|
</ng-template> |
|
<ng-template #multiExpandedIconTpl let-node let-origin="origin"> |
|
<ng-container *ngIf="node.children.length == 0; else elseTemplate"> |
|
|
|
</ng-container> |
|
<ng-template #elseTemplate> |
|
<i nz-icon [nzType]="node.isExpanded ? 'caret-down' : 'caret-right'" |
|
class="ant-tree-switcher-line-icon"></i> |
|
</ng-template> |
|
</ng-template> |
|
</div> |
|
</div> |
|
<div class="popoverBtn"> |
|
<button nz-button nzType="primary">确定</button> |
|
<button nz-button nzType="default" (click)="isPopover(doubleRandom)">取消</button> |
|
</div> |
|
</div> |
|
</ng-template> |
|
<span> |
|
已分配: <span class="blue">14/15</span> 家单位 |
|
</span> |
|
</div> |
|
<div class="panelheaderright"> |
|
<button nz-button nzType="primary">提交审核</button> |
|
<span (click)="expand(doubleRandom)" class="expand blue"> |
|
{{doubleRandom.isExpand ? '收起' :'展开'}} |
|
<i nz-icon [nzType]="doubleRandom.isExpand ? 'down' : 'up'" nzTheme="outline"></i> |
|
</span> |
|
</div> |
|
</div> |
|
<div class="panelcontent" *ngIf="doubleRandom.isExpand"> |
|
<nz-table #colSpanTable [nzData]="doubleRandom.data" nzBordered nzSize="small" |
|
[nzShowPagination]="false"> |
|
<thead> |
|
<tr> |
|
<th nzWidth="18%">责任机构</th> |
|
<th nzWidth="8%">任务额</th> |
|
<th nzWidth="25%">单位名称</th> |
|
<th nzWidth="15%">监督员</th> |
|
<th>说明</th> |
|
</tr> |
|
</thead> |
|
<tbody> |
|
<tr *ngFor="let item of colSpanTable.data; index as i"> |
|
<td>访客</td> |
|
<td>2021-11-19</td> |
|
<td> |
|
22 |
|
</td> |
|
<td> |
|
22 |
|
</td> |
|
<td style="padding:0 2px!important;"> |
|
<!-- <textarea [appDebounceInput]="700" (debounceInput)="dealInput($event)" |
|
style="border: 0;" rows="1" nz-input placeholder="一段简短的说明文字..."></textarea> --> |
|
</td> |
|
</tr> |
|
</tbody> |
|
</nz-table> |
|
</div> |
|
</div> |
|
|
|
|
|
<!-- 熟悉演练 --> |
|
<div class="panel"> |
|
<div class="panelheader"> |
|
<div class="panelheaderleft"> |
|
<div class="panelheadername panelheadernamepurple"> |
|
<img src="../../../../assets/images/icon/yanlian.png" alt=""> |
|
熟悉演练 |
|
</div> |
|
<button nz-button nzType="primary" nz-popover nzPopoverPlacement="bottomLeft" |
|
[nzPopoverContent]="contentTemplate2" [nzPopoverTrigger]=null |
|
[nzPopoverVisible]="rehearsal.isPopover" (click)="isPopover(rehearsal)">选择单位</button> |
|
<ng-template #contentTemplate2> |
|
<div class="selectUnitPopover"> |
|
<div class="popoverTitle"> |
|
<span (click)="popoverMenuSelect(rehearsal,1)" |
|
[ngClass]="{'selectedspan': rehearsal.selectedMenu == 1}">单位名称</span> |
|
<span style="margin: 0 10px;">|</span> |
|
<span (click)="popoverMenuSelect(rehearsal,2)" |
|
[ngClass]="{'selectedspan': rehearsal.selectedMenu == 2}">组织机构</span> |
|
</div> |
|
<div class="popoverContent" *ngIf="rehearsal.selectedMenu == 1"> |
|
<div> |
|
<form nz-form (ngSubmit)="submitForm(rehearsal.search1)"> |
|
<nz-form-item> |
|
<nz-form-control> |
|
<nz-input-group nzPrefixIcon="search"> |
|
<input type="text" [(ngModel)]="rehearsal.search1" nz-input |
|
placeholder="请输入单位名称" [ngModelOptions]="{standalone: true}" /> |
|
</nz-input-group> |
|
</nz-form-control> |
|
<button style="display: none;" type="submit"></button> |
|
</nz-form-item> |
|
</form> |
|
</div> |
|
<div class="popoverContentitem"> |
|
</div> |
|
</div> |
|
<div class="popoverContent" *ngIf="rehearsal.selectedMenu == 2"> |
|
<div> |
|
<form nz-form> |
|
<nz-form-item> |
|
<nz-form-control> |
|
<nz-input-group nzPrefixIcon="search"> |
|
<input type="text" [(ngModel)]="rehearsal.search2" nz-input |
|
placeholder="请输入单位名称" [ngModelOptions]="{standalone: true}" /> |
|
</nz-input-group> |
|
</nz-form-control> |
|
</nz-form-item> |
|
</form> |
|
</div> |
|
<div class="popoverContentitem"> |
|
<nz-tree [nzHideUnMatched]='true' [nzSearchValue]="rehearsal.search2" |
|
#nzTreeComponent [nzData]="rehearsal.nodes" [nzTreeTemplate]="nzTreeTemplate" |
|
nzBlockNode [nzExpandedIcon]="multiExpandedIconTpl"> |
|
</nz-tree> |
|
<ng-template #nzTreeTemplate let-node let-origin="origin"> |
|
<div class="nodebox"> |
|
|
|
<span class="name"> |
|
<label *ngIf="node.origin.isGasStation" |
|
[(ngModel)]="node.origin.isChecked" nz-checkbox |
|
(ngModelChange)="orcheckbox(rehearsal,$event,node)"></label> |
|
{{ node.title }} |
|
</span> |
|
</div> |
|
</ng-template> |
|
<ng-template #multiExpandedIconTpl let-node let-origin="origin"> |
|
<ng-container *ngIf="node.children.length == 0; else elseTemplate"> |
|
|
|
</ng-container> |
|
<ng-template #elseTemplate> |
|
<i nz-icon [nzType]="node.isExpanded ? 'caret-down' : 'caret-right'" |
|
class="ant-tree-switcher-line-icon"></i> |
|
</ng-template> |
|
</ng-template> |
|
</div> |
|
</div> |
|
<div class="popoverBtn"> |
|
<button nz-button nzType="primary">确定</button> |
|
<button nz-button nzType="default" (click)="isPopover(rehearsal)">取消</button> |
|
</div> |
|
</div> |
|
</ng-template> |
|
<span> |
|
已分配: <span class="blue">14/15</span> 家单位 |
|
</span> |
|
</div> |
|
<div class="panelheaderright"> |
|
<button nz-button nzType="primary">提交审核</button> |
|
<span (click)="expand(rehearsal)" class="expand blue"> |
|
{{rehearsal.isExpand ? '收起' :'展开'}} |
|
<i nz-icon [nzType]="rehearsal.isExpand ? 'down' : 'up'" nzTheme="outline"></i> |
|
</span> |
|
</div> |
|
</div> |
|
<div class="panelcontent" *ngIf="rehearsal.isExpand"> |
|
<nz-table #colSpanTable [nzData]="rehearsal.data" nzBordered nzSize="small" [nzShowPagination]="false"> |
|
<thead> |
|
<tr> |
|
<th nzWidth="18%">责任机构</th> |
|
<th nzWidth="8%">任务额</th> |
|
<th nzWidth="25%">单位名称</th> |
|
<th nzWidth="15%">监督员</th> |
|
<th>说明</th> |
|
</tr> |
|
</thead> |
|
<tbody> |
|
<tr *ngFor="let item of colSpanTable.data; index as i"> |
|
<td>访客</td> |
|
<td>2021-11-19</td> |
|
<td> |
|
22 |
|
</td> |
|
<td> |
|
22 |
|
</td> |
|
<td style="padding:0 2px!important;"> |
|
<textarea style="border: 0;" rows="1" nz-input placeholder="一段简短的说明文字..."></textarea> |
|
</td> |
|
</tr> |
|
</tbody> |
|
</nz-table> |
|
</div> |
|
</div> |
|
|
|
|
|
|
|
|
|
<div class="panel"> |
|
<div class="panelheader"> |
|
<div class="panelheaderleft"> |
|
<div class="panelheadername panelheadernameor"> |
|
<img src="../../../../assets/images/icon/huodong.png" alt=""> |
|
重大活动 |
|
</div> |
|
<button nz-button nzType="primary">选择单位</button> |
|
<span> |
|
已分配: <span class="blue">0/0</span> 家单位 |
|
</span> |
|
</div> |
|
<div class="panelheaderright"> |
|
<!-- <button nz-button nzType="primary">提交审核</button> |
|
<span class="expand blue"> |
|
收起 |
|
<i nz-icon nzType="down" nzTheme="outline"></i> |
|
</span> --> |
|
</div> |
|
</div> |
|
</div> |
|
<div class="panel"> |
|
<div class="panelheader"> |
|
<div class="panelheaderleft"> |
|
<div class="panelheadername panelheadernameor2"> |
|
<img src="../../../../assets/images/icon/xuanchuan.png" alt=""> |
|
消防宣传 |
|
</div> |
|
<button nz-button nzType="primary">选择单位</button> |
|
<span> |
|
已分配: <span class="blue">0/0</span> 家单位 |
|
</span> |
|
</div> |
|
<div class="panelheaderright"> |
|
<!-- <button nz-button nzType="primary">提交审核</button> |
|
<span class="expand blue"> |
|
收起 |
|
<i nz-icon nzType="down" nzTheme="outline"></i> |
|
</span> --> |
|
</div> |
|
</div> |
|
</div> |
|
<div class="panel"> |
|
<div class="panelheader"> |
|
<div class="panelheaderleft"> |
|
<div class="panelheadername panelheadernamered"> |
|
<img src="../../../../assets/images/icon/huozai.png" alt=""> |
|
火灾调查 |
|
</div> |
|
<button nz-button nzType="primary">选择单位</button> |
|
<span> |
|
已分配: <span class="blue">0/0</span> 家单位 |
|
</span> |
|
</div> |
|
<div class="panelheaderright"> |
|
<!-- <button nz-button nzType="primary">提交审核</button> |
|
<span class="expand blue"> |
|
收起 |
|
<i nz-icon nzType="down" nzTheme="outline"></i> |
|
</span> --> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |