42 changed files with 907 additions and 194 deletions
@ -0,0 +1,12 @@
|
||||
<div class="childContent"> |
||||
|
||||
<div class="childCenter"> |
||||
|
||||
</div> |
||||
|
||||
<div class="childBottom" *ngIf="beforeFence === 0"> |
||||
<button (click)="editInfo()"><i nz-icon nzType="edit" nzTheme="outline"></i>编辑信息</button> |
||||
<button (click)="deriveExcel()"><i nz-icon nzType="file-excel" nzTheme="outline"></i>导出Excel</button> |
||||
</div> |
||||
|
||||
</div> |
||||
@ -0,0 +1,34 @@
|
||||
.childContent{ |
||||
width: 100%; |
||||
height: 100%; |
||||
overflow: hidden; |
||||
display: flex; |
||||
flex-direction: column; |
||||
font-family: Source Han Sans CN; |
||||
color: #fff; |
||||
.childCenter{ |
||||
flex: 1; |
||||
overflow-x: hidden; |
||||
overflow-y: auto; |
||||
} |
||||
.childBottom{ |
||||
width: 100%; |
||||
height: 50px; |
||||
line-height: 50px; |
||||
text-align: center; |
||||
background: linear-gradient(360deg, #000D21 0%, #003B6E 100%); |
||||
box-shadow: 0px -2px 6px #36A2FF; |
||||
button{ |
||||
width: 35%; |
||||
height: 32px; |
||||
line-height: 32px; |
||||
padding: 0; |
||||
margin: 0 10px; |
||||
color: #91CCFF; |
||||
background: rgba(0, 129, 255, 0.61); |
||||
border: 1px solid #36A2FF; |
||||
cursor: pointer; |
||||
.anticon{ margin-right: 3px; } //字体图标 |
||||
} |
||||
} |
||||
} |
||||
@ -0,0 +1,40 @@
|
||||
import { Component, OnInit } from '@angular/core'; |
||||
import { PlanComponent } from '../plan/plan.component'; |
||||
|
||||
@Component({ |
||||
selector: 'app-left-domain', |
||||
templateUrl: './left-domain.component.html', |
||||
styleUrls: ['./left-domain.component.scss'] |
||||
}) |
||||
export class LeftDomainComponent implements OnInit { |
||||
|
||||
constructor() { } |
||||
|
||||
ngOnInit(): void { |
||||
this.initComponent() |
||||
} |
||||
|
||||
beforeFence: number; //当前选中功能栏
|
||||
|
||||
//初始化组件
|
||||
initComponent(type?: number) { |
||||
if (type != undefined && type != null) { |
||||
this.beforeFence = type |
||||
} else { |
||||
this.beforeFence = PlanComponent.instance.selectFence |
||||
} |
||||
} |
||||
|
||||
//编辑信息
|
||||
editInfo() { |
||||
|
||||
} |
||||
|
||||
//导出Excel
|
||||
deriveExcel() { |
||||
|
||||
} |
||||
|
||||
|
||||
|
||||
} |
||||
@ -1,85 +1,110 @@
|
||||
<div class="loading" *ngIf="isShowLoading"><nz-spin nzSimple [nzSize]="'large'"></nz-spin></div> |
||||
<div class="content"> |
||||
<canvas id="center"></canvas> |
||||
|
||||
<!-- 左侧建筑栏 --> |
||||
<div class="showLeftBuilding" title="显示" *ngIf="!isShowLeftBuilding" (click)="toggleLeftBuilding(true)"><i nz-icon nzType="right" nzTheme="outline"></i></div> |
||||
<div class="leftBuilding" [ngClass]="{'isShowLeftBuilding': isShowLeftBuilding === false}"> |
||||
<div class="hideLeft"><i nz-icon nzType="close" nzTheme="outline" title="隐藏" (click)="toggleLeftBuilding(false)"></i></div> |
||||
<div class="leftHeader"> |
||||
<h1><label>模型列表</label></h1> |
||||
<button nz-button nzType="primary" (click)="addBuildingPop = true">新建</button> |
||||
</div> |
||||
<div class="leftCenter"> |
||||
<div class="everyBuilding" *ngFor="let item of buildingUIItems" (click)='selectLeftBuilding(item)' [ngClass]="{'selectLeftBuilding': beforeOneBuildingID == item.getBuildingID()}"> |
||||
<label style="flex: 1;" class="overflowText modelTitle">{{item.getBuildingName()}}</label> |
||||
<label style="width: 65px; overflow: hidden;"> |
||||
<i nz-icon nzType="plus-circle" nzTheme="outline" title="聚焦" (click)="positionModelBuilding($event,item)"></i> |
||||
<i nz-icon nzType="edit" nzTheme="outline" title="编辑" (click)="editModelBuilding($event,item)" style="margin: 0 5px;"></i> |
||||
<i nz-icon nzType="delete" nzTheme="outline" title="删除" (click)="deleteModelBuilding($event,item)"></i> |
||||
</label> |
||||
</div> |
||||
<div class="header"> |
||||
<button *ngFor="let item of allFence; let key = index;" [ngClass]="{'selectFence': selectFence === key}" (click)="toggleHeaderFence(key)">{{item}}</button> |
||||
<div class="rightFence"> |
||||
<img src="../../../assets/images/awningShow.png" [hidden]="!isOpenAwning" (click)="toggleHeaderAwning(false)"> |
||||
<img src="../../../assets/images/awningHide.png" [hidden]="isOpenAwning" (click)="toggleHeaderAwning(true)"> |
||||
<img src="../../../assets/images/rangeFinding.png" title="测量距离" (click)="toggleMeasure(1)" [ngClass]="{'selectRightTopFast': selectMeasure == 1}"> |
||||
<img src="../../../assets/images/heightFinding.png" title="测量高度" (click)="toggleMeasure(2)" [ngClass]="{'selectRightTopFast': selectMeasure == 2}"> |
||||
<img src="../../../assets/images/measuredArea.png" title="测量面积" (click)="toggleMeasure(3)" [ngClass]="{'selectRightTopFast': selectMeasure == 3}"> |
||||
</div> |
||||
</div> |
||||
<!-- 左侧建筑栏 --> |
||||
|
||||
<!-- 底部图标栏 --> |
||||
<div class="bottomIcons"> |
||||
<div class="autoScroll"><i nz-icon nzType="left" nzTheme="outline" (click)="bottomScroll(0)"></i></div> |
||||
<div class="bottomCenter" id="bottomCenter"> |
||||
<div class="everyIcon" (click)='selectBottomIcon(item)' *ngFor="let item of allFacilityUIItemes" [ngClass]="{'selectLeftIcon': beforeOneIcon == item.getIconID()}"> |
||||
<img [src]="item.getIconURL()"> |
||||
<p>{{item.getIconName()}}</p> |
||||
<div class="center"> |
||||
<canvas id="center"></canvas> |
||||
|
||||
<!-- 左侧子组件 --> |
||||
<div class="leftChildComponent" *ngIf="isShowChildComponent" [ngStyle]="{ 'left': isShowLeftBuilding? '15%' : null }"> |
||||
<div class="leftChildHeader"> |
||||
<div><i nz-icon nzType="star" nzTheme="outline"></i></div> |
||||
<div><p>{{allFence[selectFence]}}</p></div> |
||||
<div (click)="toggleHeaderFence(selectFence)" title="关闭"><i nz-icon nzType="close-circle" nzTheme="outline"></i></div> |
||||
</div> |
||||
<div class="leftChildCenter"><app-left-domain #leftDomain></app-left-domain></div> |
||||
</div> |
||||
<div class="autoScroll"><i nz-icon nzType="right" nzTheme="outline" (click)="bottomScroll(1)"></i></div> |
||||
</div> |
||||
<!-- 底部图标栏 --> |
||||
<!-- 左侧子组件 --> |
||||
|
||||
<!-- 右上角快捷栏 --> |
||||
<div class="rightTopFast"> |
||||
<div class="publicFast leftFunction"> |
||||
<button title="获取设备" (click)="getDevice()">获</button> |
||||
<button title="清空设备" (click)="clearDevice()">清</button> |
||||
<!-- 左侧建筑栏 --> |
||||
<div class="showLeftBuilding" title="显示" *ngIf="!isShowLeftBuilding" (click)="toggleLeftBuilding(true)"><i nz-icon nzType="right" nzTheme="outline"></i></div> |
||||
<div class="leftBuilding" [ngClass]="{'isShowLeftBuilding': isShowLeftBuilding === false}"> |
||||
<div class="hideLeft"><i nz-icon nzType="close" nzTheme="outline" title="隐藏" (click)="toggleLeftBuilding(false)"></i></div> |
||||
<div class="leftHeader"> |
||||
<h1><label>模型列表</label></h1> |
||||
<button nz-button nzType="primary" (click)="addBuildingPop = true">新建</button> |
||||
</div> |
||||
<div class="leftCenter"> |
||||
<div class="everyBuilding" *ngFor="let item of buildingUIItems" (click)='selectLeftBuilding(item)' [ngClass]="{'selectLeftBuilding': beforeOneBuildingID == item.getBuildingID()}"> |
||||
<label style="flex: 1;" class="overflowText modelTitle">{{item.getBuildingName()}}</label> |
||||
<label style="width: 65px; overflow: hidden;"> |
||||
<i nz-icon nzType="plus-circle" nzTheme="outline" title="聚焦" (click)="positionModelBuilding($event,item)"></i> |
||||
<i nz-icon nzType="edit" nzTheme="outline" title="编辑" (click)="editModelBuilding($event,item)" style="margin: 0 5px;"></i> |
||||
<i nz-icon nzType="delete" nzTheme="outline" title="删除" (click)="deleteModelBuilding($event,item)"></i> |
||||
</label> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<div class="publicFast leftFast"> |
||||
<button title="平移" (click)="translation()" [ngClass]="{'selectRightTopFast': selectRightTopFast == 0}"></button> |
||||
<button title="旋转" (click)="revolve()" [ngClass]="{'selectRightTopFast': selectRightTopFast == 1}"></button> |
||||
<button title="缩放" (click)="scale()" [ngClass]="{'selectRightTopFast': selectRightTopFast == 2}"></button> |
||||
<button title="吸附" (click)="adsorb()" [ngClass]="{'leftFastIsTure': selectAdsorb }"></button> |
||||
<button title="切换至顶视图" (click)="toggleTopLevelView()" [ngClass]="{'leftFastIsTure': topLevelView }"></button> |
||||
<!-- 左侧建筑栏 --> |
||||
|
||||
<!-- 底部图标栏 --> |
||||
<div class="bottomIcons"> |
||||
<div class="autoScroll"><i nz-icon nzType="left" nzTheme="outline" (click)="bottomScroll(0)"></i></div> |
||||
<div class="bottomCenter" id="bottomCenter"> |
||||
<div class="everyIcon" (click)='selectBottomIcon(item)' *ngFor="let item of allFacilityUIItemes" [ngClass]="{'selectLeftIcon': beforeOneIcon == item.getIconID()}"> |
||||
<img [src]="item.getIconURL()"> |
||||
<p>{{item.getIconName()}}</p> |
||||
</div> |
||||
</div> |
||||
<div class="autoScroll"><i nz-icon nzType="right" nzTheme="outline" (click)="bottomScroll(1)"></i></div> |
||||
</div> |
||||
<div style="margin: 0 10px;background-color: #0080FF;" title="保存"><button (click)="preserve()"><i nz-icon nzType="save" nzTheme="outline" style="font-size: 20px;"></i></button></div> |
||||
<!-- 底部图标栏 --> |
||||
|
||||
<!-- 右上角快捷栏 --> |
||||
<div class="rightTopFast"> |
||||
<div class="publicFast leftFunction"> |
||||
<button title="获取设备" (click)="getDevice()">获</button> |
||||
<button title="清空设备" (click)="clearDevice()">清</button> |
||||
</div> |
||||
<div class="publicFast leftFast"> |
||||
<button title="平移" (click)="translation()" [ngClass]="{'selectRightTopFast': selectRightTopFast == 0}"></button> |
||||
<button title="旋转" (click)="revolve()" [ngClass]="{'selectRightTopFast': selectRightTopFast == 1}"></button> |
||||
<button title="缩放" (click)="scale()" [ngClass]="{'selectRightTopFast': selectRightTopFast == 2}"></button> |
||||
<button title="吸附" (click)="adsorb()" [ngClass]="{'leftFastIsTure': selectAdsorb }"></button> |
||||
<button title="切换至顶视图" (click)="toggleTopLevelView()" [ngClass]="{'leftFastIsTure': topLevelView }"></button> |
||||
</div> |
||||
<div style="margin: 0 10px;background-color: #0080FF;" title="保存"><button (click)="preserve()"><i nz-icon nzType="save" nzTheme="outline" style="font-size: 20px;"></i></button></div> |
||||
</div> |
||||
<!-- 右上角快捷栏 --> |
||||
|
||||
<!-- 新增/编辑左侧建筑弹窗 --> |
||||
<nz-modal [(nzVisible)]="addBuildingPop || editBuildingPop" nzTitle="创建/编辑建筑" (nzOnCancel)="addBuildingPop = false; editBuildingPop = null;" (nzOnOk)="addModelBuilding(form.value)" [nzOkDisabled]='name.invalid||modelType.invalid'> |
||||
<form nz-form #form='ngForm'> |
||||
<nz-form-item> |
||||
<nz-form-label [nzSpan]="6">名称</nz-form-label> |
||||
<nz-form-control [nzSpan]="18" nzErrorTip="请输入必填项"> |
||||
<input nz-input #name='ngModel' [(ngModel)]="modelBuilding.name" name="name" required/> |
||||
</nz-form-control> |
||||
</nz-form-item> |
||||
<nz-form-item> |
||||
<nz-form-label [nzSpan]="6">请选择模型类型</nz-form-label> |
||||
<nz-form-control [nzSpan]="18" nzErrorTip="请选择必填项"> |
||||
<nz-select #modelType='ngModel' [(ngModel)]="modelBuilding.modelType" name="modelType" required> |
||||
<nz-option nzValue="normal" nzLabel="建筑物"></nz-option> |
||||
<nz-option nzValue="environment" nzLabel="场景"></nz-option> |
||||
</nz-select> |
||||
</nz-form-control> |
||||
</nz-form-item> |
||||
<nz-form-item> |
||||
<nz-form-label [nzSpan]="6">上传文件</nz-form-label> |
||||
<nz-form-control [nzSpan]="18" nzErrorTip="请上传文件"> |
||||
<a href="javascript:;" class="uploadBackGround"><input type="file" (change)='selectFile($event)' multiple>上传文件<i nz-icon nzType="cloud-upload" nzTheme="outline"></i></a> |
||||
<p *ngIf="uploadList.length" style="font-size: 14px; text-align: left; max-height: 500px; overflow: hidden;">选择文件: <label *ngFor="let item of uploadList">{{item.name}}, </label></p> |
||||
</nz-form-control> |
||||
</nz-form-item> |
||||
</form> |
||||
</nz-modal> |
||||
<!-- 新增/编辑左侧建筑弹窗 --> |
||||
</div> |
||||
<!-- 右上角快捷栏 --> |
||||
|
||||
<!-- 新增/编辑左侧建筑弹窗 --> |
||||
<nz-modal [(nzVisible)]="addBuildingPop || editBuildingPop" nzTitle="创建/编辑建筑" (nzOnCancel)="addBuildingPop = false; editBuildingPop = null;" (nzOnOk)="addModelBuilding(form.value)" [nzOkDisabled]='name.invalid||modelType.invalid'> |
||||
<form nz-form #form='ngForm'> |
||||
<nz-form-item> |
||||
<nz-form-label [nzSpan]="6">名称</nz-form-label> |
||||
<nz-form-control [nzSpan]="18" nzErrorTip="请输入必填项"> |
||||
<input nz-input #name='ngModel' [(ngModel)]="modelBuilding.name" name="name" required/> |
||||
</nz-form-control> |
||||
</nz-form-item> |
||||
<nz-form-item> |
||||
<nz-form-label [nzSpan]="6">请选择模型类型</nz-form-label> |
||||
<nz-form-control [nzSpan]="18" nzErrorTip="请选择必填项"> |
||||
<nz-select #modelType='ngModel' [(ngModel)]="modelBuilding.modelType" name="modelType" required> |
||||
<nz-option nzValue="normal" nzLabel="建筑物"></nz-option> |
||||
<nz-option nzValue="environment" nzLabel="场景"></nz-option> |
||||
</nz-select> |
||||
</nz-form-control> |
||||
</nz-form-item> |
||||
<nz-form-item> |
||||
<nz-form-label [nzSpan]="6">上传文件</nz-form-label> |
||||
<nz-form-control [nzSpan]="18" nzErrorTip="请上传文件"> |
||||
<a href="javascript:;" class="uploadBackGround"><input type="file" (change)='selectFile($event)' multiple>上传文件<i nz-icon nzType="cloud-upload" nzTheme="outline"></i></a> |
||||
<p *ngIf="uploadList.length" style="font-size: 14px; text-align: left; max-height: 500px; overflow: hidden;">选择文件: <label *ngFor="let item of uploadList">{{item.name}}, </label></p> |
||||
</nz-form-control> |
||||
</nz-form-item> |
||||
</form> |
||||
</nz-modal> |
||||
<!-- 新增/编辑左侧建筑弹窗 --> |
||||
|
||||
</div> |
||||
|
After Width: | Height: | Size: 2.4 KiB |
|
After Width: | Height: | Size: 2.3 KiB |
|
After Width: | Height: | Size: 6.6 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 3.1 KiB |
|
After Width: | Height: | Size: 8.6 KiB |
|
After Width: | Height: | Size: 2.2 KiB |
|
After Width: | Height: | Size: 2.3 KiB |
|
After Width: | Height: | Size: 2.3 KiB |
|
After Width: | Height: | Size: 2.9 KiB |
|
After Width: | Height: | Size: 5.0 KiB |
|
After Width: | Height: | Size: 2.7 KiB |
|
After Width: | Height: | Size: 4.4 KiB |
|
After Width: | Height: | Size: 4.5 KiB |
|
After Width: | Height: | Size: 2.6 KiB |
|
After Width: | Height: | Size: 2.2 KiB |
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 2.8 KiB |
|
After Width: | Height: | Size: 2.5 KiB |
Loading…
Reference in new issue