Merge branch 'master' of http://121.36.37.70:3000/shaojiahao/Jinan_project

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 { }

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 {

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 {

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 {

src/app/home/task/zhi-audit/look-task/look-task.component.html

@@ -0,0 +1,25 @@
+<div class="box">
+    <div class="header">
+        <div>
+            
+        </div>
+        <span>
+            开发区B消防救援站
+        </span>
+        <span>
+            单位总数:9/8
+        </span>
+    </div>
+    <div>
+        <p>协助任务</p>
+        <div>
+            <span>熟悉演练</span>
+            <span>|</span>
+            <span>历下区大队</span>
+            <span>|</span>
+            <span>
+                千佛山大厦（融通地产物业管理有限公司山东分公司)
+            </span>
+        </div>
+    </div>
+</div>

src/app/home/task/zhi-audit/look-task/look-task.component.scss

@@ -0,0 +1,3 @@
+.box{
+    
+}

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 {
+  }
+
+}

src/app/home/task/zhi-audit/zhi-audit.component.html

@@ -11,6 +11,8 @@
         </div>
     </div>
     <div class="content" cdkScrollable>
+
+        <div class="cardcontent">
             <!-- 双随机 -->
             <div class="panel">
                 <div class="panelheader">
@@ -78,7 +80,6 @@
                 </div>
             </div>
 
-
             <!-- 熟悉演练 -->
             <div class="panel">
                 <div class="panelheader">
@@ -109,7 +110,8 @@
                     </div>
                 </div>
                 <div class="panelcontent" *ngIf="rehearsal.isExpand">
-                <nz-table #colSpanTable [nzData]="rehearsal.data" nzBordered nzSize="small" [nzShowPagination]="false">
+                    <nz-table #colSpanTable [nzData]="rehearsal.data" nzBordered nzSize="small"
+                        [nzShowPagination]="false">
                         <thead>
                             <tr>
                                 <th nzWidth="18%">责任机构</th>
@@ -145,9 +147,6 @@
                 </div>
             </div>
 
-
-
-
             <div class="panel">
                 <div class="panelheader">
                     <div class="panelheaderleft">
@@ -212,4 +211,34 @@
                 </div>
             </div>
         </div>
+        <div class="applycontent">
+            <p>任务列表</p>
+            <div class="taskcard">
+                <div class="taskcarditem">
+                    <div class="circlebox">
+                        <div class="circle">
+                            申请
+                        </div>
+                    </div>
+                    <div class="flexcol name">
+                        <span>熟悉演练</span>
+                        <span>任务名称</span>
+                    </div>
+                    <div class="flexcol">
+                        <span>高新技术产业开发区大队</span>
+                        <span>申请人</span>
+                    </div>
+                    <div class="flexcol flexcol1">
+                        <span>开发区A消防救援站</span>
+                        <span>责任机构</span>
+                    </div>
+                    <div>
+                        <button nz-button nzType="primary" (click)="lookTask()">查看</button>
+                    </div>
+                    <img src="../../../../assets/images/icon/agree.png" alt="">
+                </div>
+            </div>
+        </div>
+    </div>
+
 </div>

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,8 +176,10 @@
     nz-table {
       margin-top: 16px;
     }
+
     .explain {
       position: relative;
+
       img {
         width: 36px;
         height: 36px;

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));
+
+  }
 }