陈鹏飞 4 years ago
parent
commit
9ec4b965a5
  1. 23
      src/app/ui/real-cases/real-cases.component.html
  2. 35
      src/app/ui/real-cases/real-cases.component.scss
  3. 9
      src/app/ui/real-cases/real-cases.component.ts
  4. 11
      src/app/ui/similar-plans/similar-plans.component.html
  5. 16
      src/app/ui/similar-plans/similar-plans.component.scss
  6. 56
      src/app/ui/similar-plans/similar-plans.component.ts
  7. 28
      src/app/working-area/working-area.component.ts

23
src/app/ui/real-cases/real-cases.component.html

@ -1 +1,22 @@
<p>real-cases 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" >
<tr *ngFor="let leisi of leisiYuan">
<td style="color: #FFFFFF;">{{leisi.danweiName}}</td>
<td style="color: #FFFFFF;">{{leisi.year}}</td>
<td style="color: #FFFFFF;">{{leisi.zhoahuo}}</td>
<td style="color: #FFFFFF;">{{leisi.weizhi}}</td>
<td [ngClass]="{'tdyanse56':leisi.xiangjin>=50&&leisi.xiangjin<=60,'tdyanse78':leisi.xiangjin>60,'tdyanse':leisi.xiangjin<50}">{{leisi.xiangjin}}%</td>
<td style="color: #CC5D13;">查看详情</td>
</tr>
</tbody>
</table>
</div>

35
src/app/ui/real-cases/real-cases.component.scss

@ -0,0 +1,35 @@
.leisiTable{
border:1px solid #0E79A9;
height: 95%;
width: 100%;
background-color: #05385E;
margin-top: 50px;
table{
width: 100%;
height: 100%;
border-collapse:collapse;
thead{
td{
color:#F7BA2A;
height: 50px;
text-align:center;
border-bottom: 1px solid #0E79A9;
}
}
tbody{
td{
text-align:center;
}
}
}
}
.tdyanse56{
color:#3BA9F2
}
.tdyanse78{
color:#28BC69
}
.tdyanse{
color: #FFFFFF;
}

9
src/app/ui/real-cases/real-cases.component.ts

@ -12,4 +12,13 @@ export class RealCasesComponent implements OnInit {
ngOnInit(): void { ngOnInit(): void {
} }
leisiYuan=[
{danweiName:"江苏南京扬子石化",year:"2017年",zhoahuo:"液态丙烯",weizhi:"烴泵区",xiangjin:parseFloat("50%")},
{danweiName:"河北张家口中国化工集团盛华化工公司",year:"2018年",zhoahuo:"氯乙烯",weizhi:"氯乙烯一号气柜",xiangjin:parseFloat("40%")},
{danweiName:"山东临沂金誉石化",year:"2017年",zhoahuo:"液化气",weizhi:"装卸区东北侧11号卸车位",xiangjin:parseFloat("30%")},
{danweiName:"江苏省靖江市德桥化工仓储有限公司",year:"2016年",zhoahuo:"汽油",weizhi:"2号交换站",xiangjin:parseFloat("20%")},
{danweiName:"海南东方市八所港危化品码头",year:"2016年",zhoahuo:"石脑油",weizhi:"丰盛油8油轮发动机舱",xiangjin:parseFloat("10%")}
]
} }

11
src/app/ui/similar-plans/similar-plans.component.html

@ -8,7 +8,16 @@
<td style="width:10%;">相近度</td> <td style="width:10%;">相近度</td>
<td style="width:20%;">详情</td> <td style="width:20%;">详情</td>
</thead> </thead>
<tbody id="shujubody"></tbody> <tbody id="shujubody" >
<tr *ngFor="let leisi of leisiYuan">
<td style="color: #FFFFFF;">{{leisi.danweiName}}</td>
<td></td>
<td></td>
<td style="color: #FFFFFF;">{{leisi.weizhi}}</td>
<td [ngClass]="{'tdyanse56':leisi.xiangjin>=50&&leisi.xiangjin<=60,'tdyanse78':leisi.xiangjin>60,'tdyanse':leisi.xiangjin<50}">{{leisi.xiangjin}}%</td>
<td style="color: #CC5D13;">查看详情</td>
</tr>
</tbody>
</table> </table>
</div> --> </div> -->
<div style="width: 100%;height: 100%;"> <div style="width: 100%;height: 100%;">

16
src/app/ui/similar-plans/similar-plans.component.scss

@ -7,6 +7,7 @@
table{ table{
width: 100%; width: 100%;
height: 100%; height: 100%;
border-collapse:collapse;
thead{ thead{
td{ td{
color:#F7BA2A; color:#F7BA2A;
@ -15,5 +16,20 @@
border-bottom: 1px solid #0E79A9; border-bottom: 1px solid #0E79A9;
} }
} }
tbody{
td{
text-align:center;
}
}
} }
}
.tdyanse56{
color:#3BA9F2
}
.tdyanse78{
color:#28BC69
}
.tdyanse{
color: #FFFFFF;
} }

56
src/app/ui/similar-plans/similar-plans.component.ts

@ -1,4 +1,5 @@
import { Component, OnInit } from '@angular/core'; import { Component, OnInit } from '@angular/core';
import { Color } from 'cesium';
@Component({ @Component({
selector: 'app-similar-plans', selector: 'app-similar-plans',
@ -10,46 +11,25 @@ export class SimilarPlansComponent implements OnInit {
constructor() { } constructor() { }
ngOnInit(): void { ngOnInit(): void {
this.tableData()
} }
leisiYuan=[ leisiYuan=[
{danweiName:"广西钦州志诚化工有限公司",year:"XXXX年",zhoahuo:"XXX",weizhi:"2#储罐",xiangjin:"80%"}, {danweiName:"广西钦州志诚化工有限公司",year:"XXXX年",zhoahuo:"XXX",weizhi:"2#储罐",xiangjin:parseFloat("80%")},
{danweiName:"南宁交能石化有限责任公司",year:"",zhoahuo:"XXX",weizhi:"3#储罐",xiangjin:"75%"}, {danweiName:"南宁交能石化有限责任公司",year:"",zhoahuo:"XXX",weizhi:"3#储罐",xiangjin:parseFloat("75%")},
{danweiName:"广西藤县通轩立信化学有限公司",year:"",zhoahuo:"XXX",weizhi:"1#储罐",xiangjin:"70%"}, {danweiName:"广西藤县通轩立信化学有限公司",year:"",zhoahuo:"XXX",weizhi:"1#储罐",xiangjin:parseFloat("70%")},
{danweiName:"广西田东锦盛化工科技有限公司",year:"",zhoahuo:"XXXXXX",weizhi:"12#储罐",xiangjin:"60%"}, {danweiName:"广西田东锦盛化工科技有限公司",year:"",zhoahuo:"XXXXXX",weizhi:"12#储罐",xiangjin:parseFloat("60%")},
{danweiName:"梧州市联溢化工有限公司",year:"",zhoahuo:"XXX",weizhi:"5#储罐",xiangjin:"50%"}, {danweiName:"梧州市联溢化工有限公司",year:"",zhoahuo:"XXX",weizhi:"5#储罐",xiangjin:parseFloat("50%")},
{danweiName:"田东石油化工钦州港油品储运库",year:"",zhoahuo:"XXX",weizhi:"4-1#储罐",xiangjin:"40%"}, {danweiName:"田东石油化工钦州港油品储运库",year:"",zhoahuo:"XXX",weizhi:"4-1#储罐",xiangjin:parseFloat("40%")},
{danweiName:"中国石油进德油库",year:"",zhoahuo:"XXX",weizhi:"3#储罐",xiangjin:"45%"}, {danweiName:"中国石油进德油库",year:"",zhoahuo:"XXX",weizhi:"3#储罐",xiangjin:parseFloat("45%")},
{danweiName:"广西华鑫化工有限公司",year:"",zhoahuo:"XXX",weizhi:"11#储罐",xiangjin:"42%"}, {danweiName:"广西华鑫化工有限公司",year:"",zhoahuo:"XXX",weizhi:"11#储罐",xiangjin:parseFloat("42%")},
{danweiName:"广西中油能源有限公司",year:"",zhoahuo:"XXX",weizhi:"6#储罐",xiangjin:"39%"}, {danweiName:"广西中油能源有限公司",year:"",zhoahuo:"XXX",weizhi:"6#储罐",xiangjin:parseFloat("39%")},
{danweiName:"广西钦州澄星化工科技有限公司",year:"",zhoahuo:"XXX",weizhi:"5-2#储罐",xiangjin:"35%"}, {danweiName:"广西钦州澄星化工科技有限公司",year:"",zhoahuo:"XXX",weizhi:"5-2#储罐",xiangjin:parseFloat("35%")},
{danweiName:"中油广西田东石油化工总厂有限公司",year:"",zhoahuo:"XXX",weizhi:"3-1#储罐",xiangjin:"35%"} {danweiName:"中油广西田东石油化工总厂有限公司",year:"",zhoahuo:"XXX",weizhi:"3-1#储罐",xiangjin:parseFloat("30%")}
] ]
tableData(){
var res=''
for(var i=0;i<this.leisiYuan.length;i++){
res+='<tr style="color:#FFFFFF">'
res+='<td style="text-align:center;">'+this.leisiYuan[i].danweiName+'</td>'
res+='<td style="text-align:center;">'+"" +'</td>'
res+='<td style="text-align:center;">'+""+'</td>'
res+='<td style="text-align:center;">'+this.leisiYuan[i].weizhi+'</td>'
if(parseFloat(this.leisiYuan[i].xiangjin)<parseFloat('50%')){
res+='<td style="text-align:center;">'+this.leisiYuan[i].xiangjin+'</td>'
}
else if(parseFloat(this.leisiYuan[i].xiangjin)<=parseFloat('60%')&&parseFloat(this.leisiYuan[i].xiangjin)>=parseFloat('50%')){
res+='<td style="text-align:center;color:#3BA9F2">'+this.leisiYuan[i].xiangjin+'</td>'
}
else{
res+='<td style="text-align:center;color:#28BC69">'+this.leisiYuan[i].xiangjin+'</td>'
}
res+='<td style="text-align:center;"><span style="color:#CC5D13;cursor: pointer;(click)="openResponsePlans()">查看详情</span></td></tr>'
}
res+='</tbody>'
var shuju = document.getElementById('shujubody')
shuju.innerHTML=res
}
openResponsePlans(){
console.log(123)
}
} }

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

@ -786,6 +786,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
} else { } else {
this.paintingArrows.ready = true; this.paintingArrows.ready = true;
this.paintingArrows = null; this.paintingArrows = null;
this.paintMode = PaintMode.endPaint;
} }
break; break;
} }
@ -1811,18 +1812,25 @@ export class Pipeline extends PIXI.Graphics {
this.moveTo(pointA.x, pointA.y); this.moveTo(pointA.x, pointA.y);
} else { } else {
this.lineTo(pointA.x, pointA.y); this.lineTo(pointA.x, pointA.y);
if (i === count - 1) {
const pointB = this.assetData.MultiPoint[i - 1];
const angle = Math.atan2((pointA.y - pointB.y), (pointA.x - pointB.x)) * (180 / Math.PI) + 90;
this.beginFill(0x0000ff);
this.drawStar(pointA.x, pointA.y, 3, 5, 0, (Math.PI / 180 * angle));
} else {
this.drawCircle(pointA.x, pointA.y, 5);
}
} }
} }
if (this.assetData.MultiPoint.length >= 2) { this.endFill();
const pointA = this.assetData.MultiPoint[0]; // if (this.assetData.MultiPoint.length >= 2) {
const pointB = this.assetData.MultiPoint[this.assetData.MultiPoint.length - 1]; // const pointA = this.assetData.MultiPoint[this.assetData.MultiPoint.length - 2];
const angle = Math.atan2((pointB.y - pointA.y), (pointB.x - pointA.x)) * (180 / Math.PI) + 90; // const pointB = this.assetData.MultiPoint[this.assetData.MultiPoint.length - 1];
this.beginFill(0x0000ff); // const angle = Math.atan2((pointB.y - pointA.y), (pointB.x - pointA.x)) * (180 / Math.PI) + 90;
this.drawStar(pointB.x, pointB.y, 3, 5, 0, (Math.PI / 180 * angle)); // this.beginFill(0x0000ff);
// this.drawCircle(pointA.x, pointA.y, 5); // this.drawStar(pointB.x, pointB.y, 3, 5, 0, (Math.PI / 180 * angle));
// this.drawCircle(pointB.x, pointB.y, 5); // this.endFill();
this.endFill(); // }
}
} }
} }
/** /**

Loading…
Cancel
Save