17 changed files with 1574 additions and 150 deletions
@ -0,0 +1,15 @@
|
||||
{ |
||||
// 使用 IntelliSense 了解相关属性。 |
||||
// 悬停以查看现有属性的描述。 |
||||
// 欲了解更多信息，请访问: https://go.microsoft.com/fwlink/?linkid=830387 |
||||
"version": "0.2.0", |
||||
"configurations": [ |
||||
{ |
||||
"type": "pwa-chrome", |
||||
"request": "launch", |
||||
"name": "Launch Chrome against localhost", |
||||
"url": "http://localhost:4200", |
||||
"webRoot": "${workspaceFolder}" |
||||
} |
||||
] |
||||
} |
||||
@ -1 +1,23 @@
|
||||
<p>disposal-node works!</p> |
||||
<!-- 头部操作栏 --> |
||||
<div class="headerOperate"> |
||||
<div id="tedian" class="bigeditdeletebtn" (click)='xianshi(1)' ngClass="buildingbtnchecked"> |
||||
<span>火灾特点</span> |
||||
</div> |
||||
<div id="zhuyi" class="bigeditdeletebtn" (click)='xianshi(2)' ngClass="buildingbtnchecked"> |
||||
<span>注意事项</span> |
||||
</div> |
||||
<div id="chuzhi" class="bigeditdeletebtn" (click)='xianshi(3)' ngClass="buildingbtnchecked"> |
||||
<span>处置要点</span> |
||||
</div> |
||||
<div id="zuzhi" class="bigeditdeletebtn" (click)='xianshi(4)' ngClass="buildingbtnchecked"> |
||||
<span (click)='this.chooseBiaoti=4'>组织指挥要点</span> |
||||
</div> |
||||
|
||||
</div> |
||||
<!--中间文字--> |
||||
<div class="wenzi" id="aaa"> |
||||
<div class="scrollbar"></div> |
||||
</div> |
||||
<div style="width: 100%;"> |
||||
<button class="button" style="float: right;margin-right: 30px;">分享</button> |
||||
</div> |
||||
@ -0,0 +1,84 @@
|
||||
|
||||
.icongray{ |
||||
color: #D9D0DC; |
||||
} |
||||
//头部操作栏 |
||||
.headerOperate { |
||||
position: relative; |
||||
span{ |
||||
font-size: 18px; |
||||
} |
||||
flex: 2%; |
||||
display: flex; |
||||
align-items:center; |
||||
min-height: 40px; |
||||
box-sizing: border-box; |
||||
margin: 3px 0; |
||||
|
||||
.bigeditdeletebtn{ |
||||
border:1px solid #0E79A9; |
||||
margin-right: 0px; |
||||
height: 80%; |
||||
display: flex; |
||||
flex-direction: column; |
||||
// align-items:center;/*由于flex-direction: column，因此align-items代表的是水平方向*/ |
||||
justify-content: center; |
||||
user-select: none; |
||||
//background-image: url("../../../assets/images/标签正常.png") ; |
||||
background-size:100% 100%; |
||||
color: white; |
||||
span{ |
||||
padding: 13px 13px; |
||||
//padding-right: 18px; |
||||
font-size: 24px; |
||||
} |
||||
} |
||||
.bigeditdeletebtn:hover{ |
||||
cursor: pointer; |
||||
//background-image: url("../../../assets/images/标签经过.png") ; |
||||
} |
||||
|
||||
} |
||||
//中间文字区域 |
||||
.wenzi{ |
||||
overflow:auto; |
||||
height: 85%; |
||||
width: 100%; |
||||
line-height: 35px; |
||||
.h3{ |
||||
color: #CC5D13; |
||||
} |
||||
.scrollbar{ |
||||
width: 30px; |
||||
height: 300px; |
||||
margin: 0 auto; |
||||
|
||||
} |
||||
.wenzi::-webkit-scrollbar {/*滚动条整体样式*/ |
||||
width: 10px; /*高宽分别对应横竖滚动条的尺寸*/ |
||||
height: 1px; |
||||
} |
||||
.wenzi::-webkit-scrollbar-thumb {/*滚动条里面小方块*/ |
||||
border-radius: 10px; |
||||
//-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2); |
||||
background: #CC5D13; |
||||
} |
||||
.wenzi::-webkit-scrollbar-track {/*滚动条里面轨道*/ |
||||
//-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2); |
||||
border-radius: 10px; |
||||
background: #EDEDED; |
||||
} |
||||
} |
||||
.button { |
||||
border-radius: 2px; |
||||
background-color: #4CAF50; |
||||
border: none; |
||||
color: white; |
||||
padding: 15px 32px; |
||||
text-align: center; |
||||
text-decoration: none; |
||||
display: inline-block; |
||||
font-size: 16px; |
||||
margin: 4px 2px; |
||||
cursor: pointer; |
||||
} |
||||
@ -1,11 +1,95 @@
|
||||
<div class="content"> |
||||
<div class="left"> |
||||
|
||||
<div class="header leftHeader">到场力量</div> |
||||
<div class="list"> |
||||
<div class="tableDiv"> |
||||
<div class="tableRows" *ngFor="let item of allCarsData" (click)='selectCar(item)' [ngClass]="{selectIcon: canvasData.selectCar.Id == item.Id}"> |
||||
<div style="flex: 60%;display: flex;flex-direction: column;justify-content: center;align-items: center;"> |
||||
<p style="flex: 60%;font-size: 16px;font-weight: 550;" class="contentText">{{item.Name}}</p> |
||||
<p style="flex: 40%" class="contentText">{{item.FireTeamName}}</p> |
||||
</div> |
||||
<div style="flex: 40%; line-height: 50px;text-align: center;color: #37f76D;" *ngIf="item.ReachTime < 1">已到场</div> |
||||
<div style="flex: 40%; line-height: 50px;text-align: center;color: #fff;" *ngIf="item.ReachTime > 0"> |
||||
<label>{{item.ReachTime}}分钟</label> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
<!-- canvas --> |
||||
<div class="center"> |
||||
<app-working-area #workingArea></app-working-area> |
||||
<div class="center" id="center"> |
||||
<div class="header" style="position: relative;"> |
||||
<div class="title">总平面图</div> |
||||
<div class="draw"> |
||||
<label title="开始绘制" (click)='plot(0)'></label> |
||||
<label title="开始绘制" (click)='plot(1)'></label> |
||||
</div> |
||||
<div style="float: right;width: 66px;height: 100%;line-height: 40px;text-align: center;position: relative;"> |
||||
<mat-icon style="color: #fff;font-size: 32px;width: 32px;height: 32px;" (click)='toggleSay()'>volume_up</mat-icon> |
||||
<div class="rightSpeak" *ngIf="rightSayIsShow"> |
||||
<div style="flex: 1;"> |
||||
<div class="iconButton" style="background-color: #fe9400;">冷却</div> |
||||
<div class="iconButton" style="background-color: #f95e5a;">登罐</div> |
||||
<div class="iconButton" style="background-color: #0676ee;">注入泡沫</div> |
||||
</div> |
||||
<div style="width: 100%;height: 34px;line-height: 34px;display: flex;"> |
||||
<mat-icon>settings_voice</mat-icon> |
||||
<label class="sayBgc">按住说话</label> |
||||
<mat-icon>search</mat-icon> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<div class="canvas"> |
||||
<!-- 底部车辆信息 --> |
||||
<div class="bottomWork" *ngIf="bottomIsShow"> |
||||
<div style="flex: 30%;line-height: 30px;width: 120px;color: #fff;text-align: center;"> |
||||
<label>车辆属性 <mat-icon (click)="closeBottom()">highlight_off</mat-icon></label> |
||||
</div> |
||||
<div style="flex: 70%;display: flex;"> |
||||
<div style="flex: 90%;"> |
||||
<div class="publicRow" style="box-sizing: border-box;border-bottom: 1px solid #30bbec;color: #f7ae4a; font-weight: 550;"> |
||||
<p>载水量</p> |
||||
<p>载泡沫</p> |
||||
<p>载人数</p> |
||||
<p>吨位</p> |
||||
<p>执行任务</p> |
||||
<p>连接车辆</p> |
||||
<p>水源占用</p> |
||||
</div> |
||||
<div class="publicRow" style="color: #fff;font-size: 12px;"> |
||||
<p>{{canvasData.selectCar.WaterYield}}</p> |
||||
<p>{{canvasData.selectCar.Foam}}</p> |
||||
<p>{{canvasData.selectCar.PeopleNum}}</p> |
||||
<p>{{canvasData.selectCar.Tonnage}}</p> |
||||
<p> |
||||
<input type="text" class="taskInput" [(ngModel)]="canvasData.selectCar.Assignment"> |
||||
</p> |
||||
<p>{{canvasData.selectCar.LinkCar}}</p> |
||||
<p>{{canvasData.selectCar.WaterOccupy}}</p> |
||||
</div> |
||||
</div> |
||||
<div style="flex: 10%;text-align: center;line-height: 70px;"> |
||||
<button mat-button>发送</button> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
<!-- 底部车辆信息 --> |
||||
<!-- 右侧楼层区域 --> |
||||
<div class="showRightStorey" *ngIf="!rightIsShow" title="打开楼层/区域"><mat-icon (click)='openRight()'>keyboard_arrow_left</mat-icon></div> |
||||
<div class="rightStorey" [ngClass]="{closeRight: !rightIsShow,openRight: rightIsShow}"> |
||||
<div style="flex: 10%;"> |
||||
<label><mat-icon (click)='closeRight()' title="关闭楼层/区域">keyboard_arrow_right</mat-icon> 楼层/区域</label> |
||||
</div> |
||||
<div style="flex: 90%;border-top: 1px solid #30bbec;padding: 1px 0;"> |
||||
<div style="font-size: 14px;width: 100%;height: 35px;line-height: 35px;background-color: rgba(7,89,155,0.7);"><label>厂区总平面图</label></div> |
||||
</div> |
||||
</div> |
||||
<!-- 右侧楼层区域 --> |
||||
<app-working-area #workingArea></app-working-area> |
||||
</div> |
||||
|
||||
</div> |
||||
<!-- canvas --> |
||||
</div> |
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -1 +1,13 @@
|
||||
<p>similar-plans works!</p> |
||||
<div class="leisiTable"> |
||||
<table> |
||||
<thead > |
||||
<td style="width:40%;">单位名称</td> |
||||
<td style="width:10%;">始建于</td> |
||||
<td style="width:10%;">着火物</td> |
||||
<td style="width:10%;">点火位置</td> |
||||
<td style="width:10%;">相近度</td> |
||||
<td style="width:20%;">详情</td> |
||||
</thead> |
||||
<tbody id="shujubody"></tbody> |
||||
</table> |
||||
</div> |
||||
|
||||
@ -0,0 +1,19 @@
|
||||
.leisiTable{ |
||||
border:1px solid #0E79A9; |
||||
height: 95%; |
||||
width: 100%; |
||||
background-color: #05385E; |
||||
margin-top: 50px; |
||||
table{ |
||||
width: 100%; |
||||
height: 100%; |
||||
thead{ |
||||
td{ |
||||
color:#F7BA2A; |
||||
height: 50px; |
||||
text-align:center; |
||||
border-bottom: 1px solid #0E79A9; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 1.5 KiB |
|
After Width: | Height: | Size: 6.0 KiB |
Loading…
Reference in new issue