处置预案完善

src/app/pages/pages.module.ts

@@ -31,6 +31,7 @@ import { NzMessageModule } from 'ng-zorro-antd/message';
 import { NzSpinModule } from 'ng-zorro-antd/spin';
 import { NzTreeModule } from 'ng-zorro-antd/tree';
 import { NzCollapseModule } from 'ng-zorro-antd/collapse';
+import { NzStepsModule } from 'ng-zorro-antd/steps';
 import { TodayWarningAdminComponent } from './today-warning-admin/today-warning-admin.component';
 import { CriminalRecordsAdminComponent } from './criminal-records-admin/criminal-records-admin.component';
 import { EquipmentInfoComponent } from './equipment-info/equipment-info.component';
@@ -78,8 +79,8 @@ import { GetOutOfLineDetailsComponent } from './today-warning/get-out-of-line-de
     NzSpinModule,
     NzTreeModule,
     NzTreeSelectModule,
-    NzCollapseModule
-
+    NzCollapseModule,
+    NzStepsModule
   ],
   entryComponents: [AddequipmentComponent, EditequipmentComponent,GetOutOfLineDetailsComponent],
   schemas: [CUSTOM_ELEMENTS_SCHEMA]

src/app/pages/plan/plan.component.html

@@ -101,7 +101,23 @@
         <div class="planHeaderVideo"><a href="javascript:;" class="bottomPlanUpload" style="width: 100px;"><input type="file"><img src="../../../assets/images/uploadVideo.png"></a></div>
       </div>
       <div style="height: 5px;"></div>
-      <div class="pulicPlanDiv bottomPlanCenter"></div>
+      <div class="pulicPlanDiv bottomPlanCenter">
+        <label><button>处置预案</button></label>
+        <label>
+          <nz-steps>
+            <nz-step [nzIcon]="iconTemplate"></nz-step>
+            <nz-step [nzIcon]="iconTemplate"></nz-step>
+            <nz-step [nzIcon]="iconTemplate"></nz-step>
+            <ng-template #iconTemplate><img src="../../../assets/images/stepIcon.png"></ng-template>
+          </nz-steps>
+        </label>
+        <label>
+          <i nz-icon nzType="backward" nzTheme="outline"></i>
+          <i nz-icon nzType="pause" nzTheme="outline"></i>
+          <i nz-icon nzType="border" nzTheme="outline"></i>
+          <i nz-icon nzType="forward" nzTheme="outline"></i>
+        </label>
+      </div>
     </div>
     <!-- 底部处置预案 -->
 

src/app/pages/plan/plan.component.scss

@@ -292,5 +292,33 @@
   }
   .bottomPlanCenter{
     height: 35px;
+    line-height: 38px;
+    display: flex;
+    overflow: hidden;
+    label{
+      display: block;
+    }
+    label:first-child{
+      width: 15%;
+      height: 100%;
+      text-align: center;
+      button {
+        width: 60%;
+        height: 30px;
+        line-height: 30px;
+        color: #23D9FF;
+        //padding: 0;
+        background: rgba(35, 153, 255, 0.41);
+        border: 1px solid rgba(35, 217, 255, 0.4);
+      }
+    }
+    label:nth-child(2){ flex: 1; overflow: hidden; img{ height: 35px; width: auto; vertical-align: top; } }
+    label:last-child{
+      width: 15%;
+      height: 100%;
+      text-align: center;
+      color: #fff;
+      .anticon{ font-size: 20px; margin: 0 10px; }
+    }
   }
 }