diff --git a/src/app/home/home.module.ts b/src/app/home/home.module.ts index 53dc933..5d2d19d 100644 --- a/src/app/home/home.module.ts +++ b/src/app/home/home.module.ts @@ -51,6 +51,7 @@ import { NzRadioModule } from 'ng-zorro-antd/radio'; import { ApplyComponent } from './task/station-task-apply/apply/apply.component'; import { ApplyLookComponent } from './task/station-task-apply/apply-look/apply-look.component'; import { NzDatePickerModule } from 'ng-zorro-antd/date-picker'; +import { LookTaskComponent } from './task/zhi-audit/look-task/look-task.component'; @NgModule({ declarations: [ NavComponent, @@ -79,7 +80,8 @@ import { NzDatePickerModule } from 'ng-zorro-antd/date-picker'; EditorComponent, AddUnitComponent, ApplyComponent, - ApplyLookComponent + ApplyLookComponent, + LookTaskComponent ], imports: [ CommonModule, @@ -109,6 +111,6 @@ import { NzDatePickerModule } from 'ng-zorro-antd/date-picker'; NzRadioModule, NzDatePickerModule ], - entryComponents: [AddroleComponent, EditroleComponent, AdduserComponent, EdituserComponent, AddorComponent, EditorComponent, ApplyComponent, ApplyLookComponent] + entryComponents: [AddroleComponent, EditroleComponent, AdduserComponent, EdituserComponent, AddorComponent, EditorComponent, ApplyComponent, ApplyLookComponent, LookTaskComponent] }) export class HomeModule { } diff --git a/src/app/home/task/station-task-apply/station-task-apply.component.scss b/src/app/home/task/station-task-apply/station-task-apply.component.scss index 9df39e3..955fecb 100644 --- a/src/app/home/task/station-task-apply/station-task-apply.component.scss +++ b/src/app/home/task/station-task-apply/station-task-apply.component.scss @@ -4,7 +4,7 @@ color: #303133; box-sizing: border-box; - padding: 18px; + padding: 20px; .fffbox { diff --git a/src/app/home/task/station-task-execution/station-task-execution.component.scss b/src/app/home/task/station-task-execution/station-task-execution.component.scss index 8c500fc..40365e1 100644 --- a/src/app/home/task/station-task-execution/station-task-execution.component.scss +++ b/src/app/home/task/station-task-execution/station-task-execution.component.scss @@ -4,7 +4,7 @@ color: #303133; box-sizing: border-box; - padding: 18px; + padding: 20px; .fffbox { diff --git a/src/app/home/task/station-weekly-plan/station-weekly-plan.component.scss b/src/app/home/task/station-weekly-plan/station-weekly-plan.component.scss index 1d72bc1..033d493 100644 --- a/src/app/home/task/station-weekly-plan/station-weekly-plan.component.scss +++ b/src/app/home/task/station-weekly-plan/station-weekly-plan.component.scss @@ -4,7 +4,7 @@ color: #303133; box-sizing: border-box; - padding: 18px; + padding: 20px; .fffbox { diff --git a/src/app/home/task/zhi-audit/look-task/look-task.component.html b/src/app/home/task/zhi-audit/look-task/look-task.component.html new file mode 100644 index 0000000..84119d2 --- /dev/null +++ b/src/app/home/task/zhi-audit/look-task/look-task.component.html @@ -0,0 +1,25 @@ +
+
+
+ +
+ + 开发区B消防救援站 + + + 单位总数:9/8 + +
+
+

协助任务

+
+ 熟悉演练 + | + 历下区大队 + | + + 千佛山大厦(融通地产物业管理有限公司山东分公司) + +
+
+
\ No newline at end of file diff --git a/src/app/home/task/zhi-audit/look-task/look-task.component.scss b/src/app/home/task/zhi-audit/look-task/look-task.component.scss new file mode 100644 index 0000000..fe3d699 --- /dev/null +++ b/src/app/home/task/zhi-audit/look-task/look-task.component.scss @@ -0,0 +1,3 @@ +.box{ + +} \ No newline at end of file diff --git a/src/app/home/task/zhi-audit/look-task/look-task.component.ts b/src/app/home/task/zhi-audit/look-task/look-task.component.ts new file mode 100644 index 0000000..9bd20ce --- /dev/null +++ b/src/app/home/task/zhi-audit/look-task/look-task.component.ts @@ -0,0 +1,15 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-look-task', + templateUrl: './look-task.component.html', + styleUrls: ['./look-task.component.scss'] +}) +export class LookTaskComponent implements OnInit { + + constructor() { } + + ngOnInit(): void { + } + +} diff --git a/src/app/home/task/zhi-audit/zhi-audit.component.html b/src/app/home/task/zhi-audit/zhi-audit.component.html index 2e70ed2..d70851e 100644 --- a/src/app/home/task/zhi-audit/zhi-audit.component.html +++ b/src/app/home/task/zhi-audit/zhi-audit.component.html @@ -11,205 +11,234 @@
- -
-
-
-
- - 双随机 + +
+ +
+
+
+
+ + 双随机 +
+ + 已选择: 15 家单位 + + | + + 已分配: 14 家单位 + + | + + 已通过: 14/15 家单位 + +
+
+ + + + {{doubleRandom.isExpand ? '收起' :'展开'}} + +
- - 已选择: 15 家单位 - - | - - 已分配: 14 家单位 - - | - - 已通过: 14/15 家单位 -
-
- - - - {{doubleRandom.isExpand ? '收起' :'展开'}} - - +
+ + + + 责任机构 + 任务额 + 单位名称 + 监督员 + 说明 + 操作 + + + + + 访客 + 2021-11-19 + + 22 + + + 22 + + + 一段简短的说明文字... + + + + + 同意 + 驳回 + + + +
-
- - - - 责任机构 - 任务额 - 单位名称 - 监督员 - 说明 - 操作 - - - - - 访客 - 2021-11-19 - - 22 - - - 22 - - - 一段简短的说明文字... - - - - - 同意 - 驳回 - - - - -
-
- - -
-
-
-
- - 熟悉演练 + +
+
+
+
+ + 熟悉演练 +
+ + 已选择: 15 家单位 + + | + + 已分配: 14 家单位 + + | + + 已通过: 14/15 家单位 + +
+
+ + + + {{rehearsal.isExpand ? '收起' :'展开'}} + +
- - 已选择: 15 家单位 - - | - - 已分配: 14 家单位 - - | - - 已通过: 14/15 家单位 -
-
- - - - {{rehearsal.isExpand ? '收起' :'展开'}} - - +
+ + + + 责任机构 + 任务额 + 单位名称 + 监督员 + 说明 + 操作 + + + + + 访客 + 2021-11-19 + + 22 + + + 22 + + + 一段简短的说明文字... + + + + + 同意 + 驳回 + + + +
-
- - - - 责任机构 - 任务额 - 单位名称 - 监督员 - 说明 - 操作 - - - - - 访客 - 2021-11-19 - - 22 - - - 22 - - - 一段简短的说明文字... - - - - - 同意 - 驳回 - - - - -
-
- - - -
-
-
-
- - 重大活动 +
+
+
+
+ + 重大活动 +
+ + + 已分配: 0/0 家单位 +
- - - 已分配: 0/0 家单位 - -
-
- +
-
-
-
-
-
- - 消防宣传 +
+
+
+
+ + 消防宣传 +
+ + + 已分配: 0/0 家单位 +
- - - 已分配: 0/0 家单位 - -
-
- +
-
-
-
-
-
- - 火灾调查 +
+
+
+
+ + 火灾调查 +
+ + + 已分配: 0/0 家单位 +
- - - 已分配: 0/0 家单位 - -
-
- +
+
+
+
+
+

任务列表

+
+
+
+
+ 申请 +
+
+
+ 熟悉演练 + 任务名称 +
+
+ 高新技术产业开发区大队 + 申请人 +
+
+ 开发区A消防救援站 + 责任机构 +
+
+ +
+
+
\ No newline at end of file diff --git a/src/app/home/task/zhi-audit/zhi-audit.component.scss b/src/app/home/task/zhi-audit/zhi-audit.component.scss index feac492..8ac637c 100644 --- a/src/app/home/task/zhi-audit/zhi-audit.component.scss +++ b/src/app/home/task/zhi-audit/zhi-audit.component.scss @@ -42,13 +42,96 @@ } .content { - box-sizing: border-box; - padding: 20px; + flex: 1; overflow-y: auto; color: #606266; } +.cardcontent { + box-sizing: border-box; + padding: 20px; +} + +.applycontent { + box-sizing: border-box; + padding: 20px; + border-bottom: 1px dashed #C7CAD0; + border-top: 1px dashed #C7CAD0; + text-align: left; + + p { + margin-bottom: 18px; + } + + .taskcarditem { + width: 100%; + height: 100px; + background: #FFFFFF; + box-shadow: 0px 3px 8px 1px rgba(0, 0, 0, 0.0800); + border-radius: 4px 4px 4px 4px; + opacity: 1; + margin-bottom: 18px; + display: flex; + align-items: center; + position: relative; + .circlebox { + display: flex; + align-items: center; + justify-content: center; + width: 6%; + + .circle { + width: 48px; + height: 48px; + text-align: center; + line-height: 48px; + color: #fff; + border-radius: 50%; + background: linear-gradient(180deg, #8FF6D2 0%, #29CB92 100%); + opacity: 1; + } + + } + + .circlebox, + .name { + background: rgba(157, 128, 255, 0.1600); + height: 100%; + } + + .flexcol { + width: 25%; + display: flex; + flex-direction: column; + justify-content: center; + box-sizing: border-box; + padding-left: 60px; + span:nth-child(1) { + color: #303133; + margin-bottom: 6px; + } + + span:nth-child(2) { + color: #C7CAD0; + } + } + .flexcol1{ + width: 50%; + } + .name { + width: 12%; + box-sizing: border-box; + padding-left: 0; + } + img{ + position: absolute; + right: 22%; + top: 25px; + } + } +} + .panel { margin-bottom: 16px; @@ -93,9 +176,11 @@ nz-table { margin-top: 16px; } - .explain{ + + .explain { position: relative; - img{ + + img { width: 36px; height: 36px; position: absolute; diff --git a/src/app/home/task/zhi-audit/zhi-audit.component.ts b/src/app/home/task/zhi-audit/zhi-audit.component.ts index c9d85d8..25fc0f2 100644 --- a/src/app/home/task/zhi-audit/zhi-audit.component.ts +++ b/src/app/home/task/zhi-audit/zhi-audit.component.ts @@ -1,7 +1,9 @@ import { HttpClient } from '@angular/common/http'; -import { Component, OnInit, ViewChild } from '@angular/core'; +import { Component, OnInit, ViewChild, ViewContainerRef } from '@angular/core'; import { FormBuilder, FormGroup } from '@angular/forms'; +import { NzModalService } from 'ng-zorro-antd/modal'; import { TreeService } from 'src/app/service/tree.service'; +import { LookTaskComponent } from './look-task/look-task.component'; @Component({ selector: 'app-zhi-audit', templateUrl: './zhi-audit.component.html', @@ -11,7 +13,7 @@ export class ZhiAuditComponent implements OnInit { validateForm!: FormGroup; - constructor(private fb: FormBuilder, private http: HttpClient, private toTree: TreeService) { } + constructor(private fb: FormBuilder, private http: HttpClient, private toTree: TreeService, private modal: NzModalService, private viewContainerRef: ViewContainerRef) { } months = [ { name: '1月', isable: true }, @@ -116,4 +118,19 @@ export class ZhiAuditComponent implements OnInit { } console.log(data.search2Value) } + + lookTask() { + const modal = this.modal.create({ + nzTitle: '任务详情', + nzContent: LookTaskComponent, + nzViewContainerRef: this.viewContainerRef, + nzFooter: null, + nzOnOk: () => new Promise(resolve => setTimeout(resolve, 1000)) + }); + const instance = modal.getContentComponent(); + modal.afterOpen.subscribe(() => console.log('[afterOpen] emitted!')); + // Return a result when closed + modal.afterClose.subscribe(result => console.log('[afterClose] The result is:', result)); + + } }