[新增]三五级预案在线编制路由传参预案id

src/app/plan-management/create-plan-online-five/create-plan-online-five.component.html

@@ -121,7 +121,37 @@
                 <div *ngIf="selectedItem == item.groupName">
                     <!-- <p>{{item.groupName}}</p> -->
                     <div class="centerBox" *ngIf="item.groupName!='单位概况'&&item.groupName!='交通水源'&&item.groupName!='重点图示'&&item.groupName!='预案附件'">
-                        <span>111</span>
+                        <div class="boxHead">
+                            <span>{{item.groupName}}</span>
+                        </div>
+                        <div class="boxBody" *ngFor="let element of item.attribute">
+                            <div class="boxBodyHead">
+                                <span>{{element.headName}}</span>
+                            </div>
+                            <div class="body">
+                                <!--表格类型-->
+                                <table *ngIf="element.level==1">
+                                  <thead>
+                                     <th *ngFor="let itemth of element.tableth;let tablethi=index;TrackBy:trackByFn"><input type="text"
+                                       placeholder="请输入内容" [(ngModel)]="element.tableth[tablethi]"></th>
+                                  </thead>
+                                </table>
+                                <!--文本区域-->
+                                <textarea style="width: 100%;height: 100px;" *ngIf="element.level==3" [(ngModel)]="element.tableth"></textarea>
+                                <!--输入框-->
+                            <div class="inputtext" *ngIf="element.level==2">
+                                <div class="inputj" style="height: 100%;width: 100%;"
+                                   *ngFor="let itemth of element.tableth;let tablethi=index;TrackBy:trackByFn">
+                                <div style="height: 100%;width: 100%;"
+                                   *ngFor="let itemthj of element.tableth[tablethi];let tablethj=index;TrackBy:trackByFn">
+                                   <input type="text" placeholder="请输入内容" style="background-color: #E8E9E9;width: 40%;"
+                                      [(ngModel)]="itemthj.head">
+                                     <input type="text" placeholder="请输入内容" style="width: 60%;" [(ngModel)]="itemthj.body">
+                                </div>
+                               </div>
+                            </div>
+                            </div>
+                        </div>
                     </div>
                 </div>
             </div>

src/app/plan-management/create-plan-online-five/create-plan-online-five.component.scss

@@ -117,11 +117,87 @@
             .centerBox{
                 width: 100%;
                 height: 100%;
-                .paneltitle{
+                display: flex;
+                flex-direction: column;
+                .boxHead{
+                    height: 40px;
+                    width: 100%;
+                    background-color: #e8f4fe;
+                    //opacity: 0.1;
+                    span{
+                        margin-left: 20px;
+                        font-size: 16px;
+                        color: #2196F3  ;
+                        opacity:1;
+                        height: 40px;
+                        line-height: 40px;
+                    }
+                }
+                .boxBody{
+                    height: 100%;
                     width: 100%;
-                    font-size: 16px;
-                    color: #2196f3;
                     display: flex;
+                    flex-direction: column;
+                    .boxBodyHead{
+                        width: 100%;
+                        height: 40px;
+                        background-color: #FFD91D;
+                        text-align: center;
+                        span{
+                            font-size: 16px;
+                            text-align: center;
+                            height: 40px;
+                            line-height: 40px;
+                            color: #B99A00;
+                        }
+                    }
+                    .body{
+                        width: 100%;
+                        height: 100%;
+                        thead{
+                            width: 100%;
+                            background-color: #E8E9E9;
+                        }
+                        table {
+                            width: 100%;
+                            border-collapse:collapse;
+                            //background-color: #E8E9E9;
+                        }
+                        th {
+                            //background-color: #E8E9E9;
+                            border: 1px solid #999;
+                            height: 40px;
+                            font-size: 16px;
+                            text-align: center;
+                            input {
+                                background-color: #E8E9E9;
+                                text-align: center;
+                                height: 100%;
+                                width: 100%;
+                                font-size: 16px;
+                                border: none;
+                                outline: none;
+                            }
+                        }
+                        .inputtext {
+                            width: 100%;
+                            height: 100%;
+                            display: flex;
+                            flex-direction: column;
+                            input {
+                                //width: 100%;
+                                height: 40px;
+                                font-size: 16px;
+                                border: none;
+                                outline: none;
+                            }
+                            .inputj {
+                                width: 100%;
+                                height: 100%;
+                                display: flex;
+                            }
+                        }
+                    }
                 }
             }
         }

src/app/plan-management/create-plan-online-five/create-plan-online-five.component.ts

@@ -1,3 +1,11 @@
+/*
+ * @Descripttion: 
+ * @version: 
+ * @Author: sueRimn
+ * @Date: 2021-06-16 13:56:54
+ * @LastEditors: sueRimn
+ * @LastEditTime: 2021-06-16 16:26:51
+ */
 import { HttpClient } from '@angular/common/http';
 import { Component, OnInit } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
@@ -33,6 +41,7 @@ export class CreatePlanOnlineFiveComponent implements OnInit {
 
   selectedItem:string = '封面'
   clickTitleItem(item){
+    //console.log(item,key)
     item == '封面' ? this.selectedItem = '封面' : this.selectedItem = item.groupName
   }
   planTemplateData: any
@@ -45,5 +54,9 @@ export class CreatePlanOnlineFiveComponent implements OnInit {
       console.log(this.planTemplateData)
     })
   }
+  //input key值，一个字符焦点消失问题
+  trackByFn(index){
+    return index
+  }
 
 }

src/app/plan-management/entry-plan-look/entry-plan-look.component.ts

@@ -203,7 +203,7 @@ export class EntryPlanLookComponent implements OnInit {
       }
       else if (e.planType == 16) {
         if(e.attachmentUrls==null){
-          window.open(`/planManagement/createplanonlinefive?navIsOpen=false&companyId=${this.companyId}&planName=${e.name}&unitName=${this.unitdata.unitname}&planCategory=${e.planCategory}`)
+          window.open(`/planManagement/createplanonlinefive?navIsOpen=false&companyId=${this.companyId}&planName=${e.name}&unitName=${this.unitdata.unitname}&planCategory=${e.planCategory}&planId=${e.id}`)
         }
         else{
           let body = JSON.stringify("");
@@ -910,7 +910,7 @@ export class AddPlanone {
             this.planData=plandata
             this.dialogRef.close(plandata);
             //console.log(plandata)
-            window.open(`/planManagement/createplanonlinefive?navIsOpen=false&companyId=${this.data.companyId}&planName=${this.planData.name}&unitName=${this.data.unitName}&planCategory=${this.selectedPLanLevel}`)
+            window.open(`/planManagement/createplanonlinefive?navIsOpen=false&companyId=${this.data.companyId}&planName=${this.planData.name}&unitName=${this.data.unitName}&planCategory=${this.selectedPLanLevel}&planId=${this.planData.id}`)
           })
         }else{
           this.snackBar.open('请先创建模板!','确定',config);