shaojiahao
/
TheCommandPlatform-Anxin
2
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
Browse Source

[完善]类似预案基本完成

develop
邵佳豪 4 years ago
parent
adb642c8cc
commit
6b8c02e691
10 changed files with 397 additions and 52 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 101
      src/app/ui/collection-tools/collection-tools.component.html
  2. 109
      src/app/ui/collection-tools/collection-tools.component.scss
  3. 25
      src/app/ui/collection-tools/collection-tools.component.ts
  4. 27
      src/app/ui/dangerous/dangerous.component.html
  5. 71
      src/app/ui/dangerous/dangerous.component.scss
  6. 10
      src/app/ui/dangerous/dangerous.component.ts
  7. 2
      src/app/ui/plan/collection-tools.component.html
  8. 22
      src/app/ui/similar-plans/similar-plans.component.html
  9. 72
      src/app/ui/similar-plans/similar-plans.component.scss
  10. 6
      src/app/ui/similar-plans/similar-plans.component.ts

101
src/app/ui/collection-tools/collection-tools.component.html
Unescape View File

@ -112,36 +112,36 @@
</div>
</div>
</div>
<!-- 头部操作栏 -->
<div class="headerOperate">
<div class="bigeditdeletebtn" (click)="checkedBuilding({name:'总平面图'},-1)" [ngClass]="{'buildingbtnchecked': checkedBuildingIndex==-1}">
<span>总平面图</span>
</div>
<div class="bigeditdeletebtn" *ngFor="let item of allBuildings;let key = index" (click)="checkedBuilding(item,key)" [ngClass]="{'buildingbtnchecked': checkedBuildingIndex==key}">
<span>{{item.name}}</span>
</div>
<!-- <div class="bigTalkBox" style="position: absolute;right: 26px;">
<mat-icon class="titleIcon" (click)="openTalkDiv()">volume_up</mat-icon>
<div class="talkBox" *ngIf="isOpenTalk">
<div class="btndiv">
<div>泵房</div>
<div>控制室</div>
<!-- 头部操作栏 -->
<div class="headerOperate">
<div class="bigeditdeletebtn" (click)="checkedBuilding({name:'总平面图'},-1)" [ngClass]="{'buildingbtnchecked': checkedBuildingIndex==-1}">
<span>总平面图</span>
</div>
<div class="bigeditdeletebtn" *ngFor="let item of allBuildings;let key = index" (click)="checkedBuilding(item,key)" [ngClass]="{'buildingbtnchecked': checkedBuildingIndex==key}">
<span>{{item.name}}</span>
</div>
<!-- <div class="bigTalkBox" style="position: absolute;right: 26px;">
<mat-icon class="titleIcon" (click)="openTalkDiv()">volume_up</mat-icon>
<div class="talkBox" *ngIf="isOpenTalk">
<div class="btndiv">
<div>泵房</div>
<div>控制室</div>
</div>
<div class="bottomDiv">
<div>
<mat-icon>settings_voice</mat-icon>
</div>
<div>
按住说话
</div>
<div>
<mat-icon>search</mat-icon>
<div class="bottomDiv">
<div>
<mat-icon>settings_voice</mat-icon>
</div>
<div>
按住说话
</div>
<div>
<mat-icon>search</mat-icon>
</div>
</div>
</div>
</div>
</div> -->
</div>
</div> -->
</div>
<!--功能区 -->
<div class="functionalDomain">
<div class='functionalDomainContent' id="functionalDomainContent">
@ -287,8 +287,39 @@
</div>
<!-- H5Canvas -->
<div class="canvas">
<div class="canvas" style="position: relative;" >
<!-- 右侧楼层区域 -->
<!-- <div class="showRightStorey" *ngIf="!rightIsShow" title="打开楼层/区域"><mat-icon (click)='openRight()'>keyboard_arrow_left</mat-icon></div> -->
<div class="rightStorey" [ngClass]="{closeRight: !rightIsShow,openRight: rightIsShow}" cdkDragBoundary=".canvas" cdkDrag >
<div style="flex: 10%;" cdkDragHandle>
<!-- <label><mat-icon (click)='closeRight()' title="关闭楼层/区域">keyboard_arrow_right</mat-icon> 楼层/区域</label> -->
<label>楼层/区域</label>
</div>
<div style="flex: 90%;border-top: 1px solid #30bbec;padding: 1px 0;">
<div *ngFor="let item of sitePlanData;let key = index" style="font-size: 14px;width: 100%;height: 35px;line-height: 35px;background-color: rgba(7,89,155,0.7);"><label>{{item.name}}</label></div>
</div>
</div>
<!-- 右侧楼层区域 -->
<app-working-area #canvas [init]='this'></app-working-area>
<!-- 下方 -->
<div class="openbottombtn" *ngIf="!bottomIsShow" (click)="openedbottom()"><mat-icon> keyboard_arrow_up </mat-icon></div>
<div class="canvasbottomCss" [ngClass]="{'closeBottom': !bottomIsShow,'openBottom': bottomIsShow}">
<div class="title">
<div (click)="details()" [ngClass]="{'detailsAndattentBtn': detailsAndattentBtn}">
节点详情
</div>
<div (click)="attent()" [ngClass]="{'detailsAndattentBtn': !detailsAndattentBtn}">
注意事项
</div>
<div class="closebottombtn" (click)="closedbottom()"><mat-icon> expand_more </mat-icon></div>
</div>
<div class="body">
<div *ngIf="detailsAndattentBtn">{{canvasData.selectPanelPointBaseData.description}}</div>
<div *ngIf="!detailsAndattentBtn">{{canvasData.selectPanelPointBaseData.notes}}</div>
</div>
</div>
</div>
@ -492,21 +523,7 @@
</div>
</div>
<!-- <div id="bottomDiv" class="bottomCss" *ngIf="!pattern">
<div class="dragDiv" (mousedown)="bottomDivMouseDown($event)"></div>
<div class="title">
<div (click)="details()" [ngClass]="{'detailsAndattentBtn': detailsAndattentBtn}">
节点详情
</div>
<div (click)="attent()" [ngClass]="{'detailsAndattentBtn': !detailsAndattentBtn}">
注意事项
</div>
</div>
<div class="body">
<textarea *ngIf="detailsAndattentBtn" name="" id="" rows="10" [(ngModel)]="canvasData.selectPanelPointBaseData.description"></textarea>
<textarea *ngIf="!detailsAndattentBtn" name="" id="" rows="10" [(ngModel)]="canvasData.selectPanelPointBaseData.nodes"></textarea>
</div>
</div> -->
</div>
</div>

109
src/app/ui/collection-tools/collection-tools.component.scss
Unescape View File

@ -230,6 +230,115 @@
}
.canvas{
flex: 5;
.closebottombtn{
width: 30px;
vertical-align: sub;
}
.openbottombtn{
width: 30px;
color: white;
text-align: center;
height: 30px;
line-height: 30px;
vertical-align: sub;
position: absolute;
left: 5px;
bottom: 5px;
background-color:rgba(2, 44, 73, 0.9);
}
//打开时
.openBottom{
margin-bottom: 0;
transition: margin-bottom 1s;
}
//关闭
.closeBottom{
margin-bottom: -300px!important;
transition: margin-bottom 1s;
}
//右侧 楼层UI
.rightStorey {
width: 100px;
height: 250px;
position: absolute;
left: 0;
top: 50%;
margin-top: -200px;
z-index: 9999;
display: flex;
flex-direction: column;
background-color:rgba(2, 44, 73, 0.9);
color: #fff;
font-weight: 300;
>div {text-align: center; line-height: 25px;}
}
.showRightStorey {
position: absolute;
right: 0;
top: 50%;
margin-top: -13px;
z-index: 9999;
width: 26px;
height: 26px;
line-height: 26px;
text-align: center;
background-color:rgba(2, 44, 73, 0.9);
color: #fff;
}
//打开关闭右侧 楼层
.openRight {
margin-right: 0px;
transition: margin-right 0.5s;
}
.closeRight {
margin-right: -300px;
transition: margin-right 0.5s;
}
.canvasbottomCss{
margin-bottom: 0;
transition: margin-bottom 0.5s;
position: absolute;
bottom: 0;
width: 100%;
height: 200px;
display: flex;
flex-direction: column;
.title{
border-bottom: 1px solid #30bbec;
flex: 1;
div{
cursor: pointer;
background-color: rgba(2, 44, 73, 0.9);
width: 120px;
height: 30px;
line-height: 35px;
text-align: center;
margin-right: 10px;
color: white;
font-style: italic;
font-size:18px;
}
.closebottombtn{
width: 30px;
vertical-align: sub;
}
.detailsAndattentBtn{
background-color: #ed863b;
}
}
.body{
flex: 10;
background-color:rgba(2, 44, 73, 0.9);
div{
color: #d0e0f4;
font-size: 16px;
letter-spacing:5px;
margin: 5px 0 0 8px;
}
}
}
}
.functionalDomainRight {
color: white;

25
src/app/ui/collection-tools/collection-tools.component.ts
Unescape View File

@ -69,6 +69,18 @@ export class CollectionToolsComponent implements OnInit {
mySwiper:any //轮播图实例
gallery//viewerJs实例
rightIsShow = true; // 右侧楼层是否展示
// 打开 右侧楼层
openRight() {
this.rightIsShow = true;
}
// 关闭 右侧楼层
closeRight() {
console.log(123)
this.rightIsShow = false;
}
//设置属性框
setAssetsProperty(obj){
//初始化viewerJs实例
@ -174,12 +186,23 @@ export class CollectionToolsComponent implements OnInit {
//节点详情
details(){
this.detailsAndattentBtn = true
console.log(this.canvasData.selectPanelPointBaseData)
}
//注意事项
attent(){
this.detailsAndattentBtn = false
console.log(this.canvasData.selectPanelPointBaseData)
}
bottomIsShow = true//底部隐藏按钮
//关闭底部
closedbottom(){
this.bottomIsShow = false
}
//打开底部
openedbottom(){
this.bottomIsShow = true
}
//消防要素div边框高度调节
firecategoriesDivMouseDown(e){
document.onmousemove = (ev) => {

27
src/app/ui/dangerous/dangerous.component.html
Unescape View File

@ -1,7 +1,28 @@
<div class="box">
<div class="title">
<div (click)="typeSelect(1)" [ngClass]="{'selectedBtn': istype}">危化品类型</div>
<div (click)="typeSelect(2)" [ngClass]="{'selectedBtn': !istype}">危化品分布</div>
<div class="title" style="position: relative;">
<div class="divtype" (click)="typeSelect(1)" [ngClass]="{'selectedBtn': istype}">危化品类型</div>
<div class="divtype" (click)="typeSelect(2)" [ngClass]="{'selectedBtn': !istype}">危化品分布</div>
<div class="bigTalkBox" style="position: absolute;right: 26px;top: 8px;">
<mat-icon class="titleIcon" (click)="openTalkDiv()">volume_up</mat-icon>
<div class="talkBox" *ngIf="isOpenTalk">
<div class="btndiv">
<div>泵房</div>
<div>控制室</div>
</div>
<div class="bottomDiv">
<div>
<mat-icon>settings_voice</mat-icon>
</div>
<div>
按住说话
</div>
<div>
<mat-icon>search</mat-icon>
</div>
</div>
</div>
</div>
</div>
<div class="body">
<!-- 危化品类型 -->

71
src/app/ui/dangerous/dangerous.component.scss
Unescape View File

@ -9,7 +9,7 @@
width: 100%;
padding-top: 10px;
font-size: 20px;
div{
.divtype{
display: inline-block;
width: 126px;
height: 35px;
@ -22,6 +22,73 @@
.selectedBtn{
background-color: #e88108;
}
.bigTalkBox{
user-select: none;
.titleIcon{
font-size: 33px;
vertical-align: sub;
color: white;
cursor: pointer;
}
.talkBox{
width: 309px;
height: 326px;
border: 1px solid #30bbec;
background-color: #013a64;
opacity: .9 ;
position: absolute;
top: 32px;
right:4px;
z-index: 2000;
.btndiv{
div{
border-radius: 18px;
width: 70px;
height: 30px;
text-align: center;
line-height: 30px;
display: inline-block;
font-size: 13px;
color: white;
cursor: pointer;
}
div:nth-child(1){
background-color: #fe9400;
margin: 10px;
}
div:nth-child(2){
background-color: #f95e5a;
}
}
.bottomDiv{
position: absolute;
bottom:6px;
width: 100%;
height: 32px;
line-height: 32px;
display: flex;
color: white;
text-align: center;
mat-icon{
vertical-align: sub;
}
div:nth-child(1){
flex: 1;
}
div:nth-child(2){
flex: 6;
color: #409eff;
background: url('../../../assets/images/输入框.png');
background-size: 100% 100%;
}
div:nth-child(3){
flex: 1;
}
}
}
}
}
.body{
width: 99.9%;
@ -190,3 +257,5 @@
top: 0;
}

10
src/app/ui/dangerous/dangerous.component.ts
Unescape View File

@ -11,6 +11,11 @@ export class DangerousComponent implements OnInit {
map:any //地图
ngOnInit(): void {
}
//打开说话框
isOpenTalk = false
openTalkDiv(){
this.isOpenTalk = !this.isOpenTalk
}
selectedIndex = 0
typedata = [
@ -157,7 +162,10 @@ export class DangerousComponent implements OnInit {
detailNode = null
openDetails(item){
this.detailNode = item
this.isOpen = true
if(item.content){
this.isOpen = true
}
this.num = 0
}

2
src/app/ui/plan/collection-tools.component.html
Unescape View File

@ -8,6 +8,7 @@
<div class="bigeditdeletebtn" *ngFor="let item of allBuildings;let key = index" (click)="checkedBuilding(item,key)" [ngClass]="{'buildingbtnchecked': checkedBuildingIndex==key}">
<span>{{item.name}}</span>
</div>
<div class="bigTalkBox" style="position: absolute;right: 26px;">
<mat-icon class="titleIcon" (click)="openTalkDiv()">volume_up</mat-icon>
<div class="talkBox" *ngIf="isOpenTalk">
@ -29,6 +30,7 @@
</div>
</div>
</div>
</div>
<!--功能区 -->

22
src/app/ui/similar-plans/similar-plans.component.html
Unescape View File

@ -2,6 +2,28 @@
<div class="backBtn" *ngIf="isResponsePlans" (click)="back()">
返回
</div>
<div class="bigTalkBox" style="position: absolute;right: 26px;top: 8px;" [ngClass]="{cssClass: !isResponsePlans}">
<mat-icon class="titleIcon" (click)="openTalkDiv()">volume_up</mat-icon>
<div class="talkBox" *ngIf="isOpenTalk">
<div class="btndiv">
<div>泵房</div>
<div>控制室</div>
</div>
<div class="bottomDiv">
<div>
<mat-icon>settings_voice</mat-icon>
</div>
<div>
按住说话
</div>
<div>
<mat-icon>search</mat-icon>
</div>
</div>
</div>
</div>
<div class="leisiTable" *ngIf="!isResponsePlans">
<table>
<thead >

72
src/app/ui/similar-plans/similar-plans.component.scss
Unescape View File

@ -35,7 +35,7 @@
}
.backBtn{
position: absolute;
right: 30px;
right: 60px;
top: 8px;
width: 80px;
height: 30px;
@ -50,3 +50,73 @@
.backBtn:hover{
background-color: #0c4c69;
}
.bigTalkBox{
user-select: none;
.titleIcon{
font-size: 33px;
vertical-align: sub;
color: white;
cursor: pointer;
}
.talkBox{
width: 309px;
height: 326px;
border: 1px solid #30bbec;
background-color: #013a64;
opacity: .9 ;
position: absolute;
top: 32px;
right:4px;
z-index: 2000;
.btndiv{
div{
border-radius: 18px;
width: 70px;
height: 30px;
text-align: center;
line-height: 30px;
display: inline-block;
font-size: 13px;
color: white;
cursor: pointer;
}
div:nth-child(1){
background-color: #fe9400;
margin: 10px;
}
div:nth-child(2){
background-color: #f95e5a;
}
}
.bottomDiv{
position: absolute;
bottom:6px;
width: 100%;
height: 32px;
line-height: 32px;
display: flex;
color: white;
text-align: center;
mat-icon{
vertical-align: sub;
}
div:nth-child(1){
flex: 1;
}
div:nth-child(2){
flex: 6;
color: #409eff;
background: url('../../../assets/images/输入框.png');
background-size: 100% 100%;
}
div:nth-child(3){
flex: 1;
}
}
}
}
.cssClass{
top: -42px!important;
}

6
src/app/ui/similar-plans/similar-plans.component.ts
Unescape View File

@ -13,7 +13,11 @@ export class SimilarPlansComponent implements OnInit {
ngOnInit(): void {
}
//打开说话框
isOpenTalk = false
openTalkDiv(){
this.isOpenTalk = !this.isOpenTalk
}
leisiYuan=[
{danweiName:"广西钦州志诚化工有限公司",year:"XXXX年",zhoahuo:"XXX",weizhi:"2#储罐",xiangjin:parseFloat("80%")},

Write Preview
Loading…
Cancel
Save