[新增]考官阅卷预案基础功能

src/app/app-routing.module.ts

@@ -19,6 +19,7 @@ import { CollectionToolsComponent } from './ui/collection-tools/collection-tools
 import { ExaminationDetailsComponent } from './student/examination-details/examination-details.component';
 import { CollectionToolsExamineeComponent } from './ui/collection-tools-examinee/collection-tools.component';
 import { ReviewFilesComponent } from './examiner/review-files/review-files.component';
+import { CollectionToolsReadComponent } from './ui/collection-tools-read/collection-tools.component';
 
 
 
@@ -33,11 +34,12 @@ const routes: Routes = [
     ]
   },
   { path:'examiner/create-test-score', component:CreateTestScoreComponent,canActivate: [AuthGuard],}, //考官 创建考卷
-  { path:'canvasTool', component:CollectionToolsComponent,canActivate: [AuthGuard], }, //考官 编制工具
   { path:'reviewFiles', component:  ReviewFilesComponent,canActivate: [AuthGuard], }, //考官 阅卷
   { path:'examinationDetails', component:ExaminationDetailsComponent,canActivate: [AuthGuard], }, //考生试卷 考试基本信息/作战部署
+  { path:'canvasTool', component:CollectionToolsComponent,canActivate: [AuthGuard], }, //考官 编制工具
   { path:'canvasToolExaminee', component:CollectionToolsExamineeComponent,canActivate: [AuthGuard], }, //考生 编制工具
-
+  { path:'canvasToolRead', component:CollectionToolsReadComponent,canActivate: [AuthGuard], }, //考官 阅卷 编制工具
+  
   { path:'adminLogin', component:LoginComponent}, //管理员登录路由
   { path:'login', component:LockscreenComponent}, //教员学员登录路由
 ];

src/app/examiner/review-files/review-files.component.html

@@ -18,7 +18,7 @@
     <div class="right">
       <div class="headerRight">
         <label (click)='togglePaperType(1)' [ngClass]="{'selectPaperType': selectPaperType == '1'}">基本信息</label>
-        <!-- <label (click)='togglePaperType(2)' [ngClass]="{'selectPaperType': selectPaperType == '2'}">作战部署</label> -->
+        <label (click)='togglePaperType(2)' [ngClass]="{'selectPaperType': selectPaperType == '2'}">作战部署</label>
         <button (click)='submitResult()' style="width: 100px;">提交阅卷结果</button>
         <label style="float: right;margin-right: 25px;opacity: 1;width: 150px;">基本信息总分: {{selectPaper.score || 0}}分</label>
       </div>
@@ -143,20 +143,20 @@
                   <td>预案名称</td>
                   <td>添加人</td>
                   <td>修改时间</td>
-                  <td>是否公开</td>
                   <td>编制级别</td>
-                  <td>设置分数</td>
+                  <td>得分</td>
+                  <td>状态</td>
                   <td>操作</td>
                 </tr>
                 <tr *ngFor="let item of selectPaper.planList">
                   <td>{{item.title}}</td>
                   <td>{{item.creatorName}}</td>
                   <td>{{item.modifiedTime | date:'yyyy-MM-dd'}}</td>
-                  <td>{{item.isPublic ? '已公开' : '未公开'}}</td>
                   <td>{{item.planLevel | planlevel}}</td>
-                  <td style="color: #FF8678;">{{item.score}}分</td>
+                  <td style="color: #FF8678;">xxxx</td>
+                  <td>已阅</td>
                   <td>
-                    <span style="color: #07CDCF;" (click)="enterExam(item)">进入</span>
+                    <span style="color: #07CDCF;" (click)="readExam(item)">阅卷</span>
                   </td>
                 </tr>
             </table>

src/app/examiner/review-files/review-files.component.ts

@@ -14,8 +14,9 @@ export class ReviewFilesComponent implements OnInit {
 
   constructor(public canvasData:CanvasShareDataService, public http:HttpClient,public dialog: MatDialog,public snackBar: MatSnackBar,public route:ActivatedRoute) { }
 
-  ngOnInit(): void {
-    this.getTest()
+  async ngOnInit(): Promise<void> {
+    await this.getTest()
+    this.getUnitPlans()//将试卷的预案考题放进数据中
   }
 
   examId:any = this.route.snapshot.queryParams.examId //考卷id
@@ -24,25 +25,47 @@ export class ReviewFilesComponent implements OnInit {
   paperCompanyData:any = []; //考生具体考卷
   selectPaper:any = {id:null}; //选择当前考卷
   selectPaperType:string = '1'; //选择当前考卷内容 基本信息/作战部署
-
+  paperId:any//试卷id
   //获取考生试卷
-  getTest () {
-    this.http.get(`/api/Examinations/${this.examId}`).subscribe((data:any)=>{
-      this.paperData = data
-      this.paperData.examinationDataInfo.forEach(element => {
-        element.adjoinData? element.adjoinData = JSON.parse(element.adjoinData) : null
-        element.basicInfoData? element.basicInfoData = JSON.parse(element.basicInfoData) : null
-        element.facilityData? element.facilityData = JSON.parse(element.facilityData) : null
-        element.functionalDivisionData? element.functionalDivisionData = JSON.parse(element.functionalDivisionData) : null
-        element.importLocationData? element.importLocationData = JSON.parse(element.importLocationData) : null
-        element.score = element.adjoinScore + element.basicInfoScore + element.facilityScore + element.functionalDivisionScore + element.importLocationScore
-        this.examScore = this.examScore + element.score
-      });
-      this.paperCompanyData = JSON.parse( JSON.stringify(data.examinationDataInfo) ) //具体考卷
-      this.selectPaper = this.paperCompanyData[0]
+  async getTest () {
+    await new Promise((resolve, reject) => {
+      this.http.get(`/api/Examinations/${this.examId}`).subscribe((data:any)=>{
+        this.paperData = data
+        this.paperId = this.paperData.paperId
+        this.paperData.examinationDataInfo.forEach(element => {
+          element.adjoinData? element.adjoinData = JSON.parse(element.adjoinData) : null
+          element.basicInfoData? element.basicInfoData = JSON.parse(element.basicInfoData) : null
+          element.facilityData? element.facilityData = JSON.parse(element.facilityData) : null
+          element.functionalDivisionData? element.functionalDivisionData = JSON.parse(element.functionalDivisionData) : null
+          element.importLocationData? element.importLocationData = JSON.parse(element.importLocationData) : null
+          element.score = element.adjoinScore + element.basicInfoScore + element.facilityScore + element.functionalDivisionScore + element.importLocationScore
+          this.examScore = this.examScore + element.score
+        });
+        this.paperCompanyData = JSON.parse( JSON.stringify(data.examinationDataInfo) ) //具体考卷
+        this.selectPaper = this.paperCompanyData[0]
+        resolve(1)
+      })
     })
   }
-
+  //获得单位预案设定
+  async getUnitPlans(){
+    for (let index = 0; index < this.paperCompanyData.length; index++) {
+      const item = this.paperCompanyData[index];
+      let params = {
+        paperId : this.paperData.paperId,
+        companyId : item.companyInfo.id
+      }
+      await new Promise((resolve,reject)=>{
+        this.http.get(`/api/PaperPlans`,{params:params}).subscribe(data => {
+          console.log(111,data)
+          item.planList = []
+          item.planList = data
+          resolve(1)
+        })
+      }) 
+    }
+    // this.calculateScore()
+  }
   //基本信息表格 是否展示当前行
   rowIsShow (children,tag) {
     let isShow:boolean = false
@@ -74,9 +97,17 @@ export class ReviewFilesComponent implements OnInit {
     this.snackBar.open('阅卷结果提交成功','确定',config);
   }
 
-  //进入作战部署 阅卷
-  enterExam(item){
-    
+  //作战部署 阅卷
+  readExam(item){
+    console.log(this.selectPaper)
+    sessionStorage.setItem('companyName',this.selectPaper.companyInfo.name)
+    sessionStorage.setItem('planId',item.planComponentId)
+    sessionStorage.setItem('buildingTypeId',this.selectPaper.companyInfo.buildingTypes[0].id)
+    sessionStorage.setItem('companyId',this.selectPaper.companyInfo.id)
+    let openType
+    item.examPlanType == 0 ? openType = 1 : openType = 2
+    window.open(`/canvasToolRead?planName=${item.title}&paperplanId=${item.id}&openType=${openType}&paperId=${this.paperId}&examId=${this.route.snapshot.queryParams.examId}&planComponentId=${item.planComponentId}`)
   }
 
+
 }

src/app/student/examination-details/examination-details.component.ts

@@ -97,6 +97,7 @@ export class ExaminationDetailsComponent implements OnInit {
   async getUnitPlans(){
     for (let index = 0; index < this.paperCompanyData.length; index++) {
       const item = this.paperCompanyData[index];
+      console.log(888,item)
       let params = {
         paperId : item.paperId,
         companyId : item.companyInfo.id

src/app/ui/collection-tools-read/collection-tools.component.html

@@ -0,0 +1,303 @@
+<div class="content">
+  <!-- header头部 -->
+  <div class="header">
+    <div class="headerTitle">{{examMsg.conpanyName}}</div>
+    <div class="headerCenter"> 
+      <div *ngIf="planData" class="mainPointDiv">
+        <span [title]="planData.mainPoint">考试要点 : {{planData.mainPoint}}</span>
+      </div>
+    </div>
+    <div class="headerRight">
+      <button style="border: 1px solid #07CDCF; border-radius: 5px; margin: 0 15px;" (click)='lookAnswerDiv()'><mat-icon>visibility</mat-icon>
+        查看答案
+      </button>
+      <button (click)="saveSite()"><mat-icon>description</mat-icon>评分</button>
+      <button (click)="openUploadQuestions()"><mat-icon>open_in_browser</mat-icon>提交</button>
+    </div>
+  </div>
+  <!-- header头部 -->
+  <!--功能区 -->
+  <div class="functionalDomain">
+    <div class='functionalDomainContent' id="functionalDomainContent">
+      <!-- H5Canvas -->
+      <app-working-area #canvas [init]='this'></app-working-area>
+      <!-- H5Canvas -->
+
+
+      <!-- 拖拽窗口 -->
+      <div class="centerBuildingDiv" style="user-select: none;" cdkDrag>
+        <div class="centerTotal">
+          <div class="centerTotalHeader overflowText">
+            <mat-icon cdkDragHandle matTooltip="可移动窗口" matTooltipPosition="above">open_with</mat-icon>
+            <label (click)='togglebeforeOneCheckedBuilding()'>{{beforeOneCheckedBuilding.name}}</label>
+          </div>
+          <div class="everyTotal overflowText" *ngFor="let item of sitePlanData;let key = index"
+            [ngClass]="{'selectSitePlan': selectSitePlanIndex==key,'selectSitePlanColor':item.isLabel}" (click)='selectSitePlan(item,key)'>
+            {{item.name}}
+          </div>
+        </div>
+        <div style="width: 5px;height: 100%;opacity: 0;" [hidden]="!beforeOneCheckedBuildingIsShow"></div>
+        <div class="centerTotal" [hidden]="!beforeOneCheckedBuildingIsShow">
+          <div class="everyTotal" (click)="checkedBuilding({name:'总平面图'},-1)" [ngClass]="{'buildingbtnchecked': checkedBuildingIndex==-1}">总平面图</div>
+          <div class="everyTotal overflowText" *ngFor="let item of allBuildings;let key = index" (click)="checkedBuilding(item,key)"[ngClass]="{'buildingbtnchecked': checkedBuildingIndex==key}">
+            {{item.name}}
+          </div>
+        </div>
+      </div>
+
+      <!-- 查看答案拖拽窗口 -->
+      <div class="answerDivDrag" style="user-select: none;" cdkDrag *ngIf="answerDivDrag">
+
+        <div>
+          <nz-tree *ngIf="answertreeData.length != 0" nzExpandAll #nzTreeComponent [nzData]="answertreeData" nzBlockNode [nzTreeTemplate]="nzTreeTemplate"></nz-tree>
+          <ng-template #nzTreeTemplate let-node let-origin="origin">
+            <div id="terrNodePublic" (click)='selectanelPoint(node.origin,0)'  [ngClass]="{'selectanelPoint': selectDisposalNode==node.origin.id}">
+              <label title="{{node.title}}" class="overflowText textNode">{{node.title}}</label>
+            </div>
+          </ng-template>
+        </div>
+      </div>
+
+
+      <div id="leftDiv" class='functionalDomainLeft publicCss scenarioAssignment' [ngClass]="{'togglePanel': toggleExpandPanel==true}" style="user-select: none;">
+
+        <!-- 处置预案 -->
+        <div class="handlePlan">
+          <div class="planarGraphHeader" (click)='toggleHandlePlan()'>
+            <mat-icon *ngIf="toggleHandlePlans">keyboard_arrow_up</mat-icon>
+            <mat-icon *ngIf="!toggleHandlePlans">keyboard_arrow_down</mat-icon>
+            <label class="overflowText" style="font-weight: 550;">处置预案</label>
+          </div>
+          <div [hidden]="!toggleHandlePlans">
+            <div class="questionsBox"  style="padding-left: 10px;box-sizing: border-box;">
+              <p style="font-size: 15px;">考试题目</p>
+              <nz-tree *ngIf="questionstreeData.length != 0" nzExpandAll #nzTreeComponent [nzData]="questionstreeData" nzBlockNode [nzTreeTemplate]="nzTreeTemplate"></nz-tree>
+              <ng-template #nzTreeTemplate let-node let-origin="origin">
+                <div id="terrNodePublic" (click)='selectanelPoint(node.origin,0)'  [ngClass]="{'selectanelPoint': selectDisposalNode==node.origin.id}">
+                  <label title="{{node.title}}" class="overflowText textNode">{{node.title}}</label>
+                </div>
+              </ng-template>
+            </div>
+            <mat-divider style="margin: 5px 0 8px 0;"></mat-divider>
+            <div class="answerDiv"  style="padding-left: 10px;box-sizing: border-box;">
+              <p style="font-size: 15px;">考生答案</p>
+              <nz-tree #nzTreeComponent2 [nzData]="treeData" nzBlockNode [nzTreeTemplate]="nzTreeTemplate2" [nzExpandedKeys]="defaultExpandedKeys"></nz-tree>
+              <ng-template #nzTreeTemplate2 let-node let-origin="origin">
+                <div id="terrNodePublic" (click)='selectanelPoint(node.origin,1)' [ngClass]="{'selectanelPoint': selectDisposalNode==node.origin.id}">
+                  <label title="{{node.title}}" class="overflowText textNode">{{node.title}}</label>
+                </div>
+              </ng-template>
+            </div>
+
+          </div>
+        </div>
+        <!-- 处置预案 -->
+
+
+        <!-- 消防设施 -->
+        <div class="planarGraph"  id="readbasictree">
+          <div class="planarGraphHeader" (click)='togglePlanarGraph()'>
+            <mat-icon *ngIf="togglePlane">keyboard_arrow_up</mat-icon>
+            <mat-icon *ngIf="!togglePlane">keyboard_arrow_down</mat-icon>
+            <label class="overflowText" style="font-weight: 550;">消防设施</label>
+          </div>
+          <div [hidden]="!togglePlane" *ngIf="renderData.length != 0">
+            <!-- 消防列表树 -->
+            <nz-tree
+            #nzTreeComponent
+            [nzData]="renderData"
+            nzExpandAll
+            nzMultiple
+            [nzTreeTemplate]="nzTreeTemplateBasic"
+            >
+            </nz-tree>
+            <ng-template #nzTreeTemplateBasic let-node let-origin="origin">
+                <div class="treeNodeTemplate">
+                    <label class="overflowText textNode">{{node.origin.name || node.origin.Name}}</label>
+                    <span class="isLookCss" (click)="clickLookItem(node)"><mat-icon [ngClass]="{'icongray': node.origin.isLook == false}">visibility</mat-icon></span>
+                </div>
+            </ng-template>
+            <!-- 消防列表树 -->
+            <!-- 消防列表树 -->
+            <!-- <mat-tree [dataSource]="renderData" [treeControl]="treeControl">
+
+              <mat-tree-node *matTreeNodeDef="let node;" matTreeNodePadding cdkTreeNodePaddingIndent='26' (click)="clickTreeNode(node)" class="treeNode">
+                <button mat-icon-button disabled></button>
+                <span title="{{node.name}}" [ngClass]="{'treeText': !node.isTemplate}">
+                  {{node.name || node.Name}}      
+                </span> 
+                <span  *ngIf="node.isTemplate">({{node.children.length}})</span>
+                <span class="isLookCss" (click)="clickLookItem(node)"><mat-icon [ngClass]="{'icongray': node.isLook == false}">visibility</mat-icon></span>
+              </mat-tree-node>
+
+              <mat-tree-node *matTreeNodeDef="let node;when: hasChild" matTreeNodePadding (click)="clickTreeNode(node)"class="treeNode" >
+                <button mat-icon-button 
+                        matTreeNodeToggle
+                        [attr.aria-label]="'toggle ' + node.name">
+                  <mat-icon class="mat-icon-rtl-mirror">
+                    {{treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'}}
+                  </mat-icon>
+                </button>
+                <span title="{{node.name}}" [ngClass]="{'treeText': !node.isTemplate}">
+                  {{node.name || node.Name}}     
+                </span>   
+                <span *ngIf="node.isTemplate && node.isNewElement">({{node.children.length}})</span>
+                <span class="isLookCss" (click)="clickLookItem(node)"><mat-icon [ngClass]="{'icongray': node.isLook == false}">visibility</mat-icon></span>
+              </mat-tree-node>
+
+            </mat-tree> -->
+            <!-- 消防列表树 -->
+          </div>
+        </div>
+        <!-- 消防设施 -->
+
+      </div>
+
+      <div id="rightDiv" class="functionalDomainRight publicCss " [ngClass]="{'togglePanel2': toggleExpandPanelRight==true}" style="user-select: none;">
+        <!-- 右侧div鼠标拖动div -->
+        <div style="width: 3px;height: 100%;position: absolute;left: 0;cursor: e-resize;z-index: 1000;" (mousedown)="rightDivMouseDown($event)"></div>
+        <!-- 属性 -->
+        <div id="property" class="property" style="height: 100%;background-color: white;">
+          <div class="titleS"><mat-icon>info</mat-icon>属性</div>
+          <!-- 平面图属性 -->
+          <div class="siteproperty" style="user-select: none" *ngIf="isShowProperty && isShowAttribute">
+            <p>面积(平方米)</p>
+            <div class="siteproperty_size">{{canvasData.selectStorey.area}}</div>
+            <p>详情</p>
+            <div class="siteproperty_size">
+              {{canvasData.selectStorey.details}}
+            </div>
+          </div>
+          <!-- 素材属性 -->
+          <div class="assetsproperty" style="user-select: none"  *ngIf="isShowProperty && !isShowAttribute">
+            <h3 style="text-align: center;font-weight: 900;">{{assetName}}</h3>
+
+            <div *ngIf="canvasAssetObj.InteractiveMode == 0">
+              <p>宽度(像素)</p>
+              <input type="text" class="biginput" [(ngModel)]="assetWidth" disabled>
+              <p>高度(像素)</p>
+              <input type="text" class="biginput" [(ngModel)]="assetHeight" disabled>
+              <p>角度</p>
+              <div style="width: 100%;display: flex;vertical-align: top;height: 22px;">
+                <input type="number" class="smallinput" [(ngModel)]="sliderValue"
+                  oninput="if(value>360)value=360;if(value<0)value=0;" disabled>
+                <mat-slider color="primary" min="0" max="360" step="1" style="bottom: 12px;left: 2px;width: 70%;"
+                  [(ngModel)]="sliderValue" disabled></mat-slider>
+              </div>
+            </div>
+            <!-- 如果是多点连线 -->
+            <div *ngIf="canvasAssetObj.InteractiveMode == 1">
+              <p>厚度</p>
+              <div style="width: 100%;display: flex;vertical-align: top;height: 22px;">
+                <input type="number" class="smallinput" [(ngModel)]="sliderValueThickness"
+                  oninput="if(value>999)value=999;if(value<0)value=0;" disabled>
+                <mat-slider color="primary" min="0" max="999" step="1" style="bottom: 12px;left: 2px;width: 70%;"
+                  [(ngModel)]="sliderValueThickness" disabled></mat-slider>
+              </div>
+            </div>
+
+            <p style="margin-top: 4px;margin-bottom: 0px;">是否高亮</p>
+            <div>
+              <input class="input" [(ngModel)]="isHighLight" type="checkbox" disabled>
+              <span style="font-size: 14px;">选中高亮</span>
+            </div>
+            <div class="colorBigDiv" *ngIf="canvasAssetObj.FillMode == 0">
+              <div class="colorBigTemplateDiv">
+                <span>颜色</span>
+                <div class="colorTemplateDiv" [style]="{'background-color':selectedcolor}">
+
+                </div>
+              </div>
+              <!-- <span style="color: #9c9fa5;font-size: 14px;">透明度</span>
+              <mat-slider color="primary" min="0" max="100%" step="1" style="left: 1px; width: 55%;min-width: 90px;"
+                disabled></mat-slider>
+              <span style="color: #9c9fa5;font-size: 12px;">{{colorDivSliderValue}}%</span> -->
+            </div>
+            <div *ngFor="let item of PropertyInfos;index as key ">
+              <!-- 单行文本 -->
+              <div *ngIf="item.PropertyType == 0">
+                <p>{{item.PropertyName}}<span style="font-size: 14px;" *ngIf="item.PhysicalUnit">({{item.PhysicalUnit}})</span></p>
+                <input type="text" class="biginput" [value]="item.PropertyValue" disabled>
+              </div>
+              <!-- 多行文本 -->
+              <div *ngIf="item.PropertyType == 1">
+                <p>{{item.PropertyName}}<span style="font-size: 14px;" *ngIf="item.PhysicalUnit">({{item.PhysicalUnit}})</span></p>
+                <textarea class="textarea" name="" id=""  [value]="item.PropertyValue" disabled></textarea>
+              </div>
+              <!-- 数值 -->
+              <div *ngIf="item.PropertyType == 2">
+                <p>{{item.PropertyName}}<span style="font-size: 14px;" *ngIf="item.PhysicalUnit">({{item.PhysicalUnit}})</span></p>
+                <input type="number" class="biginput" [value]="item.PropertyValue" disabled>
+              </div>
+              <!-- 图片数量 -->
+              <div *ngIf="item.PropertyType == 4" style="height: 140px;">
+                <div style="position: relative;width: 100%;height: 21px;margin: 1px 0;">
+                  <p style="width: 40%;display: inline-block;">{{item.PropertyName}}</p>
+                  <span style="width: 26%;text-align:right;font-size: 13px;">{{imagesArr.length ? imagesArr.length : 0}} / {{item.PropertyValue}}</span>
+                  <input disabled *ngIf="isImgNumCss" accept="image/*" type="file" style="width: 33%;position: absolute;right: 10px;top: 1px;opacity: 0;z-index: 100;cursor: pointer;height: 21px;">
+                  
+                  <div style="position: relative;;width: 89%;border:1px solid rgb(208, 211, 214);height: 100px;margin: 6px auto;" class="swiper-container">
+                    <div id="viewerjs" class="swiper-wrapper" [ngClass]="{'noImgCss': imagesArr.length == 0}">
+                      <div class="swiper-slide" style="text-align: center;" *ngFor="let img of imagesArr"><img [src]="img.PropertyValue + '?x-oss-process=image/resize,m_fixed,h_100,w_100'" alt="" [attr.data-original]="img.PropertyValue"></div>
+                    </div>
+                    <!-- 如果需要导航按钮 -->
+                    <div class="swiper-button-next"></div>
+                    <div class="swiper-button-prev"></div>
+                  </div>
+                </div>
+              </div>
+              <!-- 方向 -->
+              <div *ngIf="item.PropertyType == 5" class="selectDiv">
+                <p style="display: inline-block;">{{item.PropertyName}}</p>
+                <select disabled>
+                  <option value ="0" [selected]="item.PropertyValue ==0">东</option>
+                  <option value ="1" [selected]="item.PropertyValue ==1">西</option>
+                  <option value ="2" [selected]="item.PropertyValue ==2">南</option>
+                  <option value ="3" [selected]="item.PropertyValue ==3">北</option>
+                  <option value ="4" [selected]="item.PropertyValue ==4">东南</option>
+                  <option value ="5" [selected]="item.PropertyValue ==5">西南</option>
+                  <option value ="6" [selected]="item.PropertyValue ==6">东北</option>
+                  <option value ="7" [selected]="item.PropertyValue ==7">西北</option>
+                </select>
+              </div>
+              <!-- 布尔值 是1或否0 -->
+              <div *ngIf="item.PropertyType == 6">
+                <p>{{item.PropertyName}}</p>
+                <input disabled [checked]="item.PropertyValue == 1" class="input" type="radio" name="radio"><span>是</span>
+                <input disabled [checked]="item.PropertyValue == 0" class="input" type="radio" name="radio"><span>否</span>
+              </div>
+              <!-- 供给区域 -->
+              <div *ngIf="item.PropertyType == 7" class="selectDiv">
+                <p style="display: inline-block;">{{item.PropertyName}}</p>
+                <select disabled>
+                  <option value ="0" [selected]="item.PropertyValue ==0">全部</option>
+                  <option value ="1" [selected]="item.PropertyValue ==1">高区</option>
+                  <option value ="2" [selected]="item.PropertyValue ==2">中区</option>
+                  <option value ="3" [selected]="item.PropertyValue ==3">低区</option>
+                  <option value ="4" [selected]="item.PropertyValue ==4">高中区</option>
+                  <option value ="5" [selected]="item.PropertyValue ==5">高低区</option>
+                  <option value ="6" [selected]="item.PropertyValue ==6">中低区</option>
+                </select>
+              </div>
+              <!-- 供给类型 -->
+              <div *ngIf="item.PropertyType == 8" class="selectDiv">
+                <p style="display: inline-block;">{{item.PropertyName}}</p>
+                <select value="4">
+                  <option value ="0" [selected]="item.PropertyValue ==0">消火栓</option>
+                  <option value ="1" [selected]="item.PropertyValue ==1">喷淋</option>
+                  <option value ="2" [selected]="item.PropertyValue ==2">水幕</option>
+                  <option value ="3" [selected]="item.PropertyValue ==3">泡沫</option>
+                  <option value ="4" [selected]="item.PropertyValue ==4">消防</option>
+                </select>
+              </div>
+          </div>
+        </div>
+        
+        </div>
+      </div>
+
+    </div>
+  </div>
+  <!--功能区 -->
+
+</div>

src/app/ui/collection-tools-read/collection-tools.component.scss

@@ -0,0 +1,498 @@
+@import './panel.scss';
+::-webkit-scrollbar {
+  display: none; /* Chrome Safari */
+}
+.content {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  box-sizing: border-box;
+  padding: 3px;
+  display: flex;
+  flex-direction: column;
+  .buildingbtnchecked{
+    background-color: #07CDCF;
+    color: white;
+  }
+}
+
+//header头部
+.header {
+  position: relative;
+  width: 100%;
+  height: 46px;
+  min-height: 46px;
+  display: flex;
+  align-items:center;
+  background-color: #fff;
+  box-shadow: inset 0px -3px 5px 0px rgb(165, 163, 163);
+  .headerTitle {
+    width: 235px;
+    overflow: hidden;
+    color: #07CDCF;
+    box-sizing: border-box;
+    padding-left: 25px;
+    font-size: 20px;
+    font-weight: 550;
+  }
+  .headerCenter {
+    flex: 1;
+    overflow: hidden;
+    .mainPointDiv{
+      box-sizing: border-box;
+      padding-left: 8px;
+      cursor: default;
+      span{
+        font-family: Source Han Sans CN;
+        color: #FF8678;
+        font-size: 15px;
+      }
+
+    }
+  }
+  .headerRight {
+    width: 350px;
+    overflow: hidden;
+    box-sizing: border-box;
+    padding-left: 10px;
+    button {
+      font-size: 14px;
+      color: #07CDCF; 
+      background-color: #fff;
+      border: none;
+      outline: none;
+      cursor:pointer;
+    }
+    .mat-icon {
+      font-size: 22px;
+      vertical-align: middle;
+      margin-right: 3px;
+    }
+  }
+}
+
+//头部操作栏
+.headerOperate {
+  img {
+    width: 24px; 
+    height: 24px;
+    vertical-align: middle;
+    margin-left: 1px;
+  }
+  span{
+    font-size: 18px;
+  }
+  flex: 5%;
+  display: flex;
+  align-items:center;
+  min-height: 40px;
+  box-sizing: border-box;
+  margin: 3px 0;
+  background-color: white;
+  button{
+    border: 0.5px solid rgb(208, 211, 214);
+    margin: 0 2px;
+  }
+  .editdeletebtn{
+    display: none;
+  }
+  .bigeditdeletebtn:hover{
+    .editdeletebtn{
+      display: inline-block;
+    }
+  }
+}
+
+//功能区
+// icon统一样式
+.mat-icon {
+  cursor:pointer;
+  vertical-align: middle;
+}
+//左右两侧功能栏 统一样式
+.publicCss {
+  border-radius: 5px;
+  position: absolute;
+  height: 100%;
+  top: 0;
+}
+.functionalDomain {
+  flex: 1;
+  overflow: hidden;
+  .functionalDomainContent {
+    position: relative;
+    width: 100%;
+    height: 100%;
+  }
+  .answerDivDrag{
+    position: absolute;
+    width: 230px;
+    min-height: 50px;
+    max-height: 560px;
+    overflow-y: auto;
+    top: 0px;
+    right: 96px;
+    z-index: 150;
+    border: 1px solid #07CDCF;
+    border-radius: 5px;
+    // display: flex;
+  }
+  .centerBuildingDiv {
+    position: absolute;
+    max-width: 400px;
+    top: 40px;
+    left: 240px;
+    z-index: 150;
+    display: flex;
+  }
+  .functionalDomainLeft {
+    background-color: #fff;
+    display: flex;
+    flex-direction: column;
+    margin-left: 0px;
+    transition: margin-left 0.5s;
+    min-width: 235px;
+    border: 1px solid #cacdd1;
+    width: 235px;
+    left: 0;
+    z-index: 111;
+    .leftDragDiv{
+      position: absolute;
+      right: 0;
+      height: 100%;
+      width: 3px;
+      z-index: 1000;
+      cursor: e-resize;
+    }
+  }
+  .functionalDomainRight {
+    z-index: 111;
+    margin-right: 0px;
+    transition:  margin-right 0.5s;
+    border: 1px solid #cacdd1;
+    width: 235px;
+    min-width: 235px;
+    right: 0;
+  }
+    //右边导航栏显示隐藏
+  .togglePanel2 {
+    margin-right: -2000px;
+    transition:  margin-right 1s;
+  }
+  //左侧导航栏显示隐藏
+  .togglePanel {
+    margin-left: -2000px;
+    transition: margin-left 1s;
+  }
+
+}
+
+//中间建筑/楼层
+.centerTotal {
+  width: 197px;
+  background-color: #fff;
+  box-shadow: 0px 0px 5px 3px rgb(165, 163, 163);
+  border-radius: 5px;
+  box-sizing: border-box;
+  padding: 5px 0;
+  .centerTotalHeader {
+    height: 30px;
+    line-height: 30px;
+    box-sizing: border-box;
+    padding: 0 5px;
+    font-size: 14px;
+    .mat-icon:hover {cursor: move;;}
+    .mat-icon {
+      font-size: 24px;
+      color: rgb(175, 164, 164);
+      margin: 0 30px 0 10px;
+    }
+  }
+  .everyTotal {
+    width: 100%;
+    height: 30px;
+    line-height: 30px;
+    box-sizing: border-box;
+    padding: 0 5px;
+    margin: 3px 0;
+    cursor:pointer;
+    font-size: 16px;
+  }
+}
+//中间建筑/楼层
+
+//右边操作栏
+.titleS{
+  width: 100%;
+  height: 35px;
+  line-height: 35px;
+  padding-left: 5px;
+  box-sizing: border-box;
+  color: #07CDCF;
+  .mat-icon {vertical-align: middle; margin-right: 5px; font-size: 22px;}
+}
+input { border: none; outline: none; background-color: #d6dddf; box-sizing: border-box; padding-left: 5px; }
+
+//右侧属性
+.property{
+  display: flex;
+  flex-flow: column;
+  .siteproperty{
+    height: 100%;
+    overflow-y: auto;
+    p{
+      color: #9c9fa5;
+      padding-left: 5px;
+    }
+    .siteproperty_size{
+      background-color: #F2F5F6;
+      width: 93%;
+      margin: 0 auto;
+      border-radius: 3px;
+      min-height: 21px;
+    }
+    .rightAttribute{
+      width: 12%;
+      height: 99.5%;
+      position: absolute;
+      top: 0;
+      right: 0;
+      bottom: 0;
+      border: 2px solid #464646;
+    }
+  }
+  .assetsproperty{
+    overflow-y: auto;
+    height: 100%;
+    p{
+      color: #9c9fa5;
+      margin:1px 0 3px 8px;
+      font-size: 14px;
+    }
+    span{
+      font-size: 15px;
+    }
+    input{
+      height: 24px;
+      border-radius: 3px;
+    }
+    .biginput{
+      display: block;
+      width: 88%;
+      margin: 0 auto;
+    }
+    .smallinput{
+      display: block;
+      width: 19%;
+      margin-left: 8px;
+    }
+    .textarea{
+      display: block;
+      width: 88%;
+      height: 50px;
+      margin: 0 auto;
+    }
+    .swiper-button-next{
+      right: 6px;
+    }
+    .swiper-button-prev{
+      left: 6px;
+    }
+    .swiper-container{
+      // --swiper-theme-color: #ff6600;/* 设置Swiper风格 */
+      // --swiper-navigation-color: #00ff33;/* 单独设置按钮颜色 */
+      --swiper-navigation-size:20px;/* 设置按钮大小 */
+    }
+    .hoverred:hover{
+      color: rgb(187, 28, 28);
+    }
+    .selectDiv{
+      height: 21px;
+      position: relative;
+      margin-bottom: 5px;
+      select{
+        width: 98px;
+        height: 22px;
+        vertical-align: middle;
+        position: absolute;
+        right: 10px;
+        top: 1px;
+        border: 1px solid rgb(208, 211, 214);
+        border-radius: 2px;
+      }
+    }
+    .colorBigDiv{
+      width: 88%;
+      margin-left: 8px;
+      .colorBigTemplateDiv{
+        span{
+          color: #9c9fa5;
+          font-size: 14px;
+          height: 26px;
+          line-height: 26px;
+        }
+        .colorTemplateDiv{
+          width: 65%;
+          height: 22px;
+          display: inline-block;
+          vertical-align: middle;
+          margin-left: 26px;
+        }
+      }
+      
+      .colorDiv{
+        .colorLi{
+          width: 24px;
+          height: 24px;
+          list-style: none;
+          float: left;
+          border: 2px solid white;
+        }
+        .coloractive{
+          border: 2px solid black;
+        }
+      }
+    }
+      
+  }
+}
+//右侧消防要素
+.firecategories{
+  position: relative;
+  display: flex;
+  flex-flow: column;
+  .firecategoriesTree{
+    overflow-y: auto;
+    height: 100%;
+  }
+}
+
+// 解决轮播图蓝框问题
+div:focus {
+  outline: none;
+}
+//没有图片时显示无图片背景图
+.noImgCss{
+  background: url(../../../assets/images/noImg.png) no-repeat center center;
+  background-size: 88% 100%;/*按比例缩放*/
+}
+.input{
+  width: 18px;
+  height: 18px;
+  vertical-align: middle;
+  margin-left: 9px;
+  margin-right: 3px;
+}
+
+// tree
+.isLookCss{
+  margin-left: auto;
+  color: #07CDCF;
+  .icongray{
+    color: #D9D0DC;
+  }
+}
+.mat-tree-node{
+  padding-right: 3px;
+  min-height: 30px;
+  height: 30px;
+  font-size: 12px;
+  cursor: pointer;
+}
+.treeNode:hover{
+  background-color: #ccebf8;
+}
+.isLookPattern{
+  display: none;
+}
+.treeText{
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  display: inline-block;
+  width: 65px;
+}
+
+.bigBox{
+  width: 700px;
+  height: 40px;
+  position: absolute;
+  overflow: hidden;
+  right: 0;
+}
+.weatherBox{
+  height: 40px;
+  width: 700px;
+  line-height: 40px;
+  position: absolute;
+  right: 0;
+  transition: right linear .5s;
+  .openbtn{
+    font-size: 45px;
+    height: 45px;
+    width: 40px;
+  }
+  .name{
+    font-size: 16px;
+    vertical-align: middle;
+    margin-left: 3px;
+  }
+  input{
+    width: 140px;
+    height: 22px;
+    margin-left: 3px;
+  }
+  select{
+    width: 96px;
+    height: 25px;
+    margin-left: 3px;
+    vertical-align: middle;
+  }
+}
+.open{
+  right: 0px;
+}
+.close{
+  right:-622px;
+}
+.bottomCss{
+  position: absolute;
+  left: 232px;
+  right: 0px;
+  bottom: 0;
+  height: 158px;
+  width: auto;
+  z-index: 111;
+  background-color: white;
+  border: 1px solid #464646;
+  .dragDiv{
+    width: 100%;
+    height: 3px;
+    position: absolute;
+    top: 0;
+    z-index: 111;
+    cursor: n-resize;
+  }
+  .title{
+    height: 35px;
+    background-color: #464646;
+    div{
+      background-color: #464646;
+      float: left;
+      width: 80px;
+      color: white;
+      font-size: 13px;
+      padding-left: 5px;
+      cursor: pointer;
+    }
+    .detailsAndattentBtn{
+      background-color: #595959;
+    }
+  }
+  .body{
+    textarea{
+      width: 100%;
+      border-radius: 0px;
+   }   
+  }
+}

src/app/ui/collection-tools-read/collection-tools.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { CollectionToolsComponent } from './collection-tools.component';
+
+describe('CollectionToolsComponent', () => {
+  let component: CollectionToolsComponent;
+  let fixture: ComponentFixture<CollectionToolsComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ CollectionToolsComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(CollectionToolsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/ui/collection-tools-read/examinationQuestions.html

@@ -0,0 +1,26 @@
+<div style="min-width: 240px;" >
+  <div style="text-align: center;font-weight: 550;">需要标记的消防设施</div>
+  <div id="nodeTree" style="max-height: 300px;overflow-y: auto; margin: 25px 0;">
+    <!-- 消防列表树 -->
+    <nz-tree
+    #nzTreeComponent
+    [nzData]="renderData"
+    nzExpandAll
+    nzMultiple
+    (nzClick)="nzEvent($event)"
+    (nzExpandChange)="nzEvent($event)"
+    (nzCheckBoxChange)="nzEvent($event)"
+    [nzTreeTemplate]="nzTreeTemplate"
+    >
+    </nz-tree>
+    <ng-template #nzTreeTemplate let-node let-origin="origin">
+        <div class="treeNodeTemplate">
+            <label class="overflowText textNode">{{node.origin.name || node.origin.Name}}</label>
+        </div>
+    </ng-template>
+    <!-- 消防列表树 -->
+  </div>
+  <div style="text-align: center;">
+    <button mat-stroked-button style="margin-left: 15px;border: none;background: #dfe0e0;" mat-dialog-close>取消</button>
+  </div>
+</div>

src/app/ui/collection-tools-read/examinationQuestions.ts

@@ -0,0 +1,290 @@
+import { Component, OnInit, Inject, ViewChild } from '@angular/core';
+import { HttpClient, HttpHeaders } from '@angular/common/http';
+import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
+import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar';
+import {CanvasShareDataService,DisposalNodeData} from '../../canvas-share-data.service' //引入服务
+import { FlatTreeControl } from '@angular/cdk/tree';
+import { MatTreeFlatDataSource, MatTreeFlattener } from '@angular/material/tree';
+import { NzFormatBeforeDropEvent, NzFormatEmitEvent,NzTreeComponent } from 'ng-zorro-antd/tree';
+import { ActivatedRoute } from '@angular/router';
+//查看需要标记的消防设施按钮
+@Component({
+  selector: 'dialog-examination-questions',
+  templateUrl: './examinationQuestions.html',
+  styleUrls: ['./collection-tools.component.scss',]
+})
+export class examinationQuestionsRead {
+
+    constructor(private http:HttpClient, public dialog: MatDialog, public snackBar: MatSnackBar, public dialogRef: MatDialogRef<any>,
+    @Inject(MAT_DIALOG_DATA) public data) {}
+
+    @ViewChild('nzTreeComponent', { static: false }) nzTreeComponent!: NzTreeComponent;
+
+    renderData:any
+    ngOnInit(): void {
+      let data = JSON.parse(JSON.stringify(this.data.Facilities))
+      data ? data.forEach(item => {
+        let realData = item.children
+        let allFireElements = JSON.parse(JSON.stringify(this.data.allFireElements))
+        item.children = this.processingData(allFireElements,realData)
+      }) :null
+      this.renderData = data
+    }
+    //处理数据 将消防要素模板与真实素材结合
+    processingData(allFireElements,realData){
+      allFireElements[allFireElements.length-1].children = []
+     
+      realData.forEach(item => {
+        item.isLeaf = true
+        let noMatch = allFireElements.find( every=> every.id === item.FireElementId)
+        if (!noMatch) {
+          allFireElements[allFireElements.length-1].children.push(item)
+        }
+      })
+      let treeData = [] //tree型 处理完成后的数据
+      allFireElements.forEach(element => {
+        element.key = element.id
+        element.name != '其他' ? element.children = [] : null
+        if(realData && realData.length != 0){
+          realData.forEach(item => {
+            if(element.id == item.FireElementId){
+              element.children.push(item)
+            }
+          })
+        }
+        allFireElements.forEach(item => { if (item.parentId == element.id) {element.children.push(item)} });
+      });
+      allFireElements.forEach(element => {
+        if (!element.parentId) { treeData.push(element) }
+      });
+      function recursionFilterEmpty(originalList, result) {
+        for(let i = 0, length = originalList.length; i < length; i++) {
+            const item = originalList[i];
+            if (item.PropertyInfos) {
+                // 最内层
+                result.push(item);
+            } else if (item.children && item.children.length) {
+                const newChildren = [];
+                // 递归调用，底层的真实数据会全部 push 进 newChildren 中
+                recursionFilterEmpty(item.children, newChildren);
+                if (newChildren.length) {
+                    // 替换原始数据
+                    item.children = newChildren;
+                    // 子项有真实的数据，就保留这一项
+                    result.push(item);
+                } // 如果没有这一项就会被删除
+            }
+        }
+      }
+      function filterEmpty(listData) {
+          const result = [];
+          recursionFilterEmpty(listData, result);
+          return result;
+      }
+      return filterEmpty(treeData)
+
+    }
+
+
+    nzEvent($event){
+      console.log($event)
+    }
+
+
+
+}
+
+
+//上传按钮
+@Component({
+  selector: 'dialog-upload-questions',
+  templateUrl: './uploadQuestions.html',
+  styleUrls: ['./collection-tools.component.scss',]
+})
+export class uploadQuestionsRead {
+
+    constructor(private http:HttpClient, public dialog: MatDialog, public snackBar: MatSnackBar, public dialogRef: MatDialogRef<any>,
+    @Inject(MAT_DIALOG_DATA) public data,private route:ActivatedRoute) {}
+
+
+
+
+    renderData:any
+    labeledOfBasicIcon:any //当前页面各建筑各楼层已标注的基本信息集合
+    async ngOnInit(): Promise<void> {
+      let params = {
+        examinationId : this.route.snapshot.queryParams.examId,
+        planComponentId : this.route.snapshot.queryParams.planComponentId
+      }
+      let SitePlanData
+      let BuildingPlanData
+      await new Promise((resolve,reject) => {
+        this.http.get('/api/ExamSitePlanData/ExamData',{params}).subscribe(data => {
+          SitePlanData = data
+          resolve(1)
+        })
+      }) 
+      await new Promise((resolve,reject) => {
+        this.http.get('/api/ExamBuildingAreaData/ExamData',{params}).subscribe(data => {
+          BuildingPlanData = data
+          resolve(2)
+        })
+      }) 
+      this.labeledOfBasicIcon = [...SitePlanData,...BuildingPlanData]
+
+
+      let data = JSON.parse(JSON.stringify(this.data.Facilities))
+      console.log('一共有哪几层需要标注',data)
+      data ? data.forEach(item => {
+        let realData = item.children
+        let allFireElements = JSON.parse(JSON.stringify(this.data.allFireElements))
+        item.children = this.processingData(allFireElements,realData,item.key)
+      }) :null
+
+      this.renderData = data
+    }
+
+
+
+    //处理数据 将消防要素模板与真实素材结合
+    processingData(allFireElements,realData,key){
+
+      //key为当前处理数据的层id
+
+
+      allFireElements[allFireElements.length-1].children = []
+    
+      //数组根据某个属性去重 （一类素材只保留一个）
+      const res = new Map();
+      realData = realData.filter((a) => !res.has(a.TemplateId) && res.set(a.TemplateId, 1))
+      console.log('当层需要标记的',realData)
+      this.labeledOfBasicIcon.forEach(item => {
+        if(item.sitePlanId == key || item.buildingAreaId == key ){
+          let data = JSON.parse(item.data) 
+          console.log('当层已经标记的',data)
+          let arr = []
+          for (const key in data) {
+            arr.push(data[key])
+          }
+          realData.forEach(i => {
+            let isexist = arr.some((ele)=>{
+              return ele.TemplateId == i.TemplateId
+            })
+            isexist ? i.xxx = true : null
+            console.log(666,isexist)
+          })
+        }
+      })
+
+
+      realData.forEach(item => {
+        item.isLeaf = true
+        let noMatch = allFireElements.find( every=> every.id === item.FireElementId)
+        if (!noMatch) {
+          allFireElements[allFireElements.length-1].children.push(item)
+        }
+      })
+      let treeData = [] //tree型 处理完成后的数据
+      allFireElements.forEach(element => {
+        element.key = element.id
+        element.name != '其他' ? element.children = [] : null
+        if(realData && realData.length != 0){
+          realData.forEach(item => {
+            if(element.id == item.FireElementId){
+              element.children.push(item)
+            }
+          })
+        }
+        allFireElements.forEach(item => { if (item.parentId == element.id) {element.children.push(item)} });
+      });
+      allFireElements.forEach(element => {
+        if (!element.parentId) { treeData.push(element) }
+      });
+      function recursionFilterEmpty(originalList, result) {
+        for(let i = 0, length = originalList.length; i < length; i++) {
+            const item = originalList[i];
+            if (item.PropertyInfos) {
+                // 最内层
+                result.push(item);
+            } else if (item.children && item.children.length) {
+                const newChildren = [];
+                // 递归调用，底层的真实数据会全部 push 进 newChildren 中
+                recursionFilterEmpty(item.children, newChildren);
+                if (newChildren.length) {
+                    // 替换原始数据
+                    item.children = newChildren;
+                    // 子项有真实的数据，就保留这一项
+                    result.push(item);
+                } // 如果没有这一项就会被删除
+            }
+        }
+      }
+      function filterEmpty(listData) {
+          const result = [];
+          recursionFilterEmpty(listData, result);
+          return result;
+      }
+      return filterEmpty(treeData)
+
+    }
+
+    nzEvent($event){
+      console.log($event)
+    }
+    //上传
+    submit () {   
+      // this.dialogRef.close();
+      const config = new MatSnackBarConfig();
+      config.verticalPosition = 'top';
+      config.duration = 3000
+      this.snackBar.open('提交成功,页面将于一秒后关闭','确定',config);
+      setTimeout(() => {
+        window.close()
+      }, 1000);
+    }
+
+}
+
+
+
+//保存考的节点
+@Component({
+  selector: 'dialog-disposal-nodes',
+  templateUrl: './uploadDisposalNodes.html',
+  styleUrls: ['./collection-tools.component.scss',]
+})
+export class uploadDisposalNodesRead {
+
+  constructor(private http:HttpClient, public dialog: MatDialog, public snackBar: MatSnackBar, public dialogRef: MatDialogRef<any>,
+  @Inject(MAT_DIALOG_DATA) public data) {}
+  @ViewChild('nzTreeComponent', { static: false }) nzTreeComponent!: NzTreeComponent;
+  
+  ngOnInit(): void {
+    this.treeData = [...this.data.treeData]
+  }
+  treeData:any = []; //tree
+
+  //提交 保存考试节点
+  submit () {
+    let checkList = []
+    this.data.oldTreeData.forEach(element => {
+      let isChecked = (this.nzTreeComponent.getTreeNodeByKey(element.id)).isChecked
+      isChecked? checkList.push(element) : null
+    });
+    let galfList = this.nzTreeComponent.getHalfCheckedNodeList()
+    this.data.oldTreeData.forEach(element => {
+      galfList.forEach(elements => {
+        element.id == elements.origin.id? checkList.push(element) : null
+      });
+    });
+    if (checkList.length) {
+      this.dialogRef.close(checkList);
+    } else {
+      const config = new MatSnackBarConfig();
+      config.verticalPosition = 'top';
+      config.duration = 3000
+      this.snackBar.open('请选择节点','确定',config);
+    }
+  }
+
+}

src/app/ui/collection-tools-read/panel.scss

@@ -0,0 +1,294 @@
+.matIcons {
+  color: #8E909F;
+}
+
+
+
+//平面图 素材库 公共样式 头部
+.planarGraphHeader{
+  height: 35px;
+  min-height: 35px;
+  cursor: pointer;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  padding: 0 24px;
+  // border-radius: 5px;
+  font-family: Roboto, "Helvetica Neue", sans-serif;
+  font-size: 15px;
+  font-weight: 400;
+  color: #fff;
+  background: #07CDCF;
+}
+//平面图头部字体图标样式
+.hover {
+  width: 18px;
+  height: 18px;
+  margin-left: 90px;
+  border: 1px solid #999;
+  border-radius: 3px;
+  .mat-icon {font-size: 18px; color: #999;}
+}
+.hover:hover { 
+  background-color: #4DA5FA;
+  .mat-icon {color: #fff;}
+}
+
+//平面图
+.sitePlanContent {
+  position: relative;
+  width: 100%;
+  height: 35px;
+  line-height: 35px;
+  box-sizing: border-box;
+  padding: 0 10px 0 25px;
+  .mat-icon {
+    font-size: 20px;
+  }
+}
+
+//火源/力量 图标
+.fireForce {
+  display: block;
+  float: right;
+  margin: 8px 5px 0 0;
+  width: 40px;
+  height: 20px;
+  line-height: 20px;
+  text-align: center;
+  position: relative;
+  overflow: hidden;
+  img{
+    width: 20px; 
+    height: 20px;
+  }
+}
+//替换底图  inputfile
+.a-upload {
+  display: block;
+  float: right;
+  margin: 8px 18px 0 0;
+  width: 20px;
+  height: 20px;
+  line-height: 20px;
+  text-align: center;
+  position: relative;
+  overflow: hidden;
+  input {
+    position: absolute;
+    width: 20px;
+    height: 20px;
+    left: 0;
+    top: 0;
+    opacity: 0;
+  }
+}
+.a-upload:hover {
+  .mat-icon {
+    color: #fff;
+  }
+}
+//上传底图 inputfile
+#a-uploadImg {
+  display: block;
+  width: 300px;
+  height: 170px;
+  position: fixed;
+  top: 40%;
+  left: 48%;
+  overflow: hidden;
+  border-radius: 5px;
+  border: 1px solid #999;
+  z-index: 999;
+  input {
+    position: absolute;
+    width: 300px;
+    height: 170px;
+    left: 0;
+    top: 0;
+    opacity: 0;
+  }
+  img {
+    width: 100%;
+    height: auto;
+  }
+}
+#a-uploadImg:hover {
+  border: 5px solid skyblue;
+}
+
+//hover时显示右边操作栏
+.sitePlanContent:hover {
+  #rightOperate {
+    display: block;
+  }
+}
+//右边操作栏
+#rightOperate{
+  width: 50px;
+  height: 100px;
+  position: absolute;
+  top: -32px;
+  right: -48px;
+  z-index: 99999;
+  border-radius: 0 100px 100px 0;
+  background-color: #F0F4F7;
+  // #F0F4F7 cdced1
+  display: none;
+  .functionButton {
+    height: 25%;
+    line-height: 25px;
+  }
+  .bigFunctionIcon {
+    font-size: 24px;
+  }
+  .functionIcon {
+    color: #999;
+  }
+  .functionIcon:hover {
+    color: #4DA5FA;
+  }
+}
+
+//处置预案 素材库 公用div
+.publiclBankPlan {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  padding-bottom: 10px;
+}
+
+
+
+//   基本信息/想定作业 切换
+.scenarioAssignment {
+  overflow-y: auto;
+}
+.selectEditMode {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+}
+.materialBankDIV{
+  flex: 1;
+  overflow-x: hidden;
+  overflow-y: auto;
+}
+//   基本信息/想定作业 切换
+//处置预案
+#terrNodePublic {
+  height: 35px;
+  line-height: 35px;
+  display: flex;
+  .textNode {flex: 1;}
+}
+//字体图标
+.planIconDiv {
+  display: inline-block;
+  .mat-icon{
+    font-size: 20px;
+    width: 20px;
+    height: 20px;
+    color: #666;
+    margin-right: 3px;
+  }
+}
+
+
+
+.mat-expansion-panel-header {
+  height: 40px !important;
+}
+//素材库溢出隐藏
+#materialBank {
+  margin: 1px 0;
+}
+//素材库图片flex
+.mat-expansion-panel-header {background-color: #d6f4f5;}
+#panelLibrary .text{
+  box-sizing: border-box;
+  margin-left: 10px;
+}
+.panelLibraryFlex {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  justify-content: space-between; /* 水平居中 */
+  .imgBox {
+    width: 70px;
+    height: 100px;
+    display: inline-block;
+    text-align: center;
+    border-radius: 3px;
+    margin: 5px 0;
+    img {
+      width: 70px;
+      height: auto;
+      max-height: 70px;
+      cursor:pointer;
+    }
+    p {
+      font-size: 12px;
+      cursor:pointer;
+    }
+  }
+}
+
+//文本溢出
+.overflowText {
+  overflow: hidden;
+  text-overflow:ellipsis;
+  white-space: nowrap;
+}
+// 楼层/区域 是避难层时
+.isRefugeStorey {
+  color: #FF8678;
+  background-color: #fff;
+}
+//选中平面图时
+.selectSitePlan {
+  color: #fff;
+  background-color: #07CDCF;
+}
+.selectSitePlanColor {
+  color: #FF8678;
+}
+//选中素材库图片时
+.selectImg {
+  color: #fff;
+  background-color: #4DA5FA;
+}
+//选中 处置节点时
+.selectanelPoint {
+  background-color: #F4C235;
+}
+
+
+
+//左侧功能区弹出框样式
+.keyMargin {
+  width: 100%;
+  margin: 5px 0;
+  .mat-form-field {
+    width: 100%;
+  }
+}
+.submitBottom {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  justify-content: space-between; /* 水平居中 */
+}
+.functionalDomainContent {
+  width: 300px;
+  height: 100%;
+  textarea {
+    border-radius: 5px;
+    border: 1px solid #999;
+    width: 100%;
+    height: 120px;
+    resize:none;
+  }
+}

src/app/ui/collection-tools-read/uploadDisposalNodes.html

@@ -0,0 +1,14 @@
+<div id="disposalNodeTree">
+  <div style="max-height: 500px;overflow-x: hidden;overflow-y: auto;margin-bottom: 25px;width: 330px;padding-right: 10px;">
+    <nz-tree #nzTreeComponent [nzData]="treeData" nzCheckable nzMultiple [nzTreeTemplate]="nzTreeTemplate"></nz-tree>
+    <ng-template #nzTreeTemplate let-node let-origin="origin">
+      <div id="terrNodePublic">
+        <label title="{{node.title}}" class="overflowText textNode">{{node.title}}</label>
+      </div>
+    </ng-template>
+  </div>
+  <div style="text-align: center;">
+    <button mat-stroked-button style="margin-right: 15px;border: none;background: #07CDCF;color: #fff;" (click)='submit()'>确定</button>
+    <button mat-stroked-button style="margin-left: 15px;border: none;background: #dfe0e0;" mat-dialog-close>取消</button>
+  </div>
+</div>

src/app/ui/collection-tools-read/uploadQuestions.html

@@ -0,0 +1,32 @@
+<div style="min-width: 260px;" id="uploadfiretree">
+  <div style="text-align: center;font-weight: 550;">提交</div>
+  <div style="font-size: 14px; font-weight: 550;margin: 5px 0;">考核消防设施:</div>
+
+  <div style="max-height: 200px;overflow-y: auto;margin-bottom: 25px;">
+    <!-- 消防列表树 -->
+    <nz-tree
+    *ngIf="renderData"
+    [nzData]="renderData"
+    nzMultiple
+    nzExpandAll
+    (nzClick)="nzEvent($event)"
+    (nzExpandChange)="nzEvent($event)"
+    (nzCheckBoxChange)="nzEvent($event)"
+    [nzTreeTemplate]="nzTreeTemplate"
+    >
+    </nz-tree>
+    <ng-template #nzTreeTemplate let-node let-origin="origin">
+        <div class="treeNodeTemplate">
+            <label class="overflowText textNode">{{node.origin.name || node.origin.Name}}
+              <span *ngIf="node.origin.xxx" style="color: #FF8678;">(已标注)</span>
+              <span *ngIf="!node.origin.xxx && node.origin.PropertyInfos">(未标注)</span>
+            </label>
+        </div>
+    </ng-template>
+    <!-- 消防列表树 -->
+  </div>
+  <div style="text-align: center;">
+    <button mat-stroked-button style="margin-right: 15px;border: none;background: #07CDCF;color: #fff;" (click)='submit()'>确定</button>
+    <button mat-stroked-button style="margin-left: 15px;border: none;background: #dfe0e0;" mat-dialog-close>取消</button>
+  </div>
+</div>

src/app/ui/ui.module.ts

@@ -65,8 +65,10 @@ import {TeacherManagementComponent,editTeacher,seeTeacher} from './teacherManage
 import { CollectionToolsExamineeComponent } from './collection-tools-examinee/collection-tools.component';
 import { examinationQuestionsExaminee, uploadDisposalNodesExaminee, uploadQuestionsExaminee } from './collection-tools-examinee/examinationQuestions';
 import { saveOneDialogExaminee, saveTwoDialogExaminee } from './collection-tools-examinee/save';
+import { CollectionToolsReadComponent } from './collection-tools-read/collection-tools.component';
+import { examinationQuestionsRead, uploadDisposalNodesRead, uploadQuestionsRead } from './collection-tools-read/examinationQuestions';
 @NgModule({
-  declarations: [ChangepasswordComponent,ConfirmpswDirective, ChangeuserdataComponent,testState,CollectionToolsComponent,CreateBuilding,EditBuilding,ViewDetailss,leftFunctionalDomainComponent,editPlaneFigureComponent,addDisposalNodeComponent,editDisposalNodeComponent,saveOneDialog,saveTwoDialog,WorkingAreaComponent,examinationQuestions,uploadQuestions,AddEnterpriserUser,EnterpriseuserComponent,editenterpriseuser,seeenterpriseuser,AddTeacher,TeacherManagementComponent,editTeacher,seeTeacher,uploadDisposalNodes,CollectionToolsExamineeComponent,examinationQuestionsExaminee,uploadQuestionsExaminee,uploadDisposalNodesExaminee,saveOneDialogExaminee,saveTwoDialogExaminee],
+  declarations: [ChangepasswordComponent,ConfirmpswDirective, ChangeuserdataComponent,testState,CollectionToolsComponent,CreateBuilding,EditBuilding,ViewDetailss,leftFunctionalDomainComponent,editPlaneFigureComponent,addDisposalNodeComponent,editDisposalNodeComponent,saveOneDialog,saveTwoDialog,WorkingAreaComponent,examinationQuestions,uploadQuestions,AddEnterpriserUser,EnterpriseuserComponent,editenterpriseuser,seeenterpriseuser,AddTeacher,TeacherManagementComponent,editTeacher,seeTeacher,uploadDisposalNodes,CollectionToolsExamineeComponent,examinationQuestionsExaminee,uploadQuestionsExaminee,uploadDisposalNodesExaminee,saveOneDialogExaminee,saveTwoDialogExaminee,CollectionToolsReadComponent,examinationQuestionsRead,uploadQuestionsRead,uploadDisposalNodesRead],
   imports: [
     NzDatePickerModule,
     CommonModule,

src/app/working-area/working-area.component.ts

@@ -571,6 +571,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
    * 创建节点图形
    */
   public createNodeShape(nodeData: any) {
+    console.log(789,nodeData)
     if (nodeData !== undefined && nodeData !== null) {
       Object.keys(nodeData).forEach((key) => {
         Object.keys(nodeData[key]).forEach((tempKey) => {

src/styles.scss

@@ -118,7 +118,7 @@ table td.mat-footer-cell:last-of-type{
 }
 
 
-#nodeTree,#basicinfodiv,#uploadfiretree{
+#nodeTree,#basicinfodiv,#uploadfiretree,#readbasictree{
 	.ant-tree .ant-tree-switcher {
 		line-height: 22px;
 	  }