+
-
品名
-
理化属性
-
危害特性
-
灭火剂
-
储运注意事项
+
品名
+
理化属性
+
危害特性
+
灭火剂
+
储运注意事项
-
diff --git a/src/app/ui/dangerous/dangerous.component.scss b/src/app/ui/dangerous/dangerous.component.scss
index f68c763..488243e 100644
--- a/src/app/ui/dangerous/dangerous.component.scss
+++ b/src/app/ui/dangerous/dangerous.component.scss
@@ -8,6 +8,7 @@
flex: 2%;
width: 100%;
padding-top: 10px;
+ font-size: 20px;
div{
display: inline-block;
width: 126px;
@@ -35,6 +36,28 @@
// flex: 20%;
width: 16%;
border-right: 1px solid #26b5fb;
+ div{
+ white-space: nowrap;/*一行显示*/
+ overflow: hidden;/*超出部分隐藏*/
+ text-overflow: ellipsis;/*用...代替超出部分*/
+ width: 100%;
+ height:46px;
+ line-height:46px;
+ letter-spacing: 3px;
+ font-size: 20px;
+ color: white;
+ // padding-left: 5px;
+ cursor: pointer;
+ span{
+ margin-left: 6px;
+ }
+ }
+ div:hover{
+ background-color: #e6963c;
+ }
+ .divselected{
+ background-color: #e88108;
+ }
}
.rightbox{
width: 100%;
@@ -73,14 +96,14 @@
border-bottom: 1px solid #26b5fb;
width: 100%;
}
+ tr:nth-child(2){
+ margin-top: 8px;
+ }
}
}
}
- .size{
- width: 100%;
- height: 100%;
- }
+
.openDiv{
z-index: 3000;
width:600px;
@@ -94,12 +117,16 @@
background: #063659;
opacity: 0.9;
border: 1px solid #26b5fb;
+ div{
+ float: left;
+ }
.top{
width: 100%;
height: 32px;
line-height: 32px;
text-align: center;
- border-bottom: 1px solid #26b5fb;
+ border-bottom: 1px solid #ff4949;
+ font-size: 18px;
position: relative;
h4{
color: red;
@@ -117,10 +144,11 @@
}
.details{
width: 100%;
- height: 100%;
+ height: 468px;
+ display: flex;
.left{
height: 100%;
- width: 24%;
+ flex: 2;
border-right:1px solid #26b5fb;
div{
width: 100%;
@@ -135,7 +163,29 @@
background: #041f33;
}
}
+ .right{
+ flex: 8;
+ height: 468px;
+ color: white;
+ letter-spacing: 2px;
+ padding: 5px 8px;
+ }
}
}
}
-}
\ No newline at end of file
+}
+
+.size{
+ width: 100%;
+ height: 100%;
+ position: relative;
+ z-index: 100;
+}
+#selectedBox{
+ width: 120px;
+ height: 20px;
+ position: absolute;
+ z-index: 101;
+ left: 6px;
+ top: 0;
+}
diff --git a/src/app/ui/dangerous/dangerous.component.ts b/src/app/ui/dangerous/dangerous.component.ts
index 11c0e4e..3fe0e24 100644
--- a/src/app/ui/dangerous/dangerous.component.ts
+++ b/src/app/ui/dangerous/dangerous.component.ts
@@ -12,50 +12,139 @@ export class DangerousComponent implements OnInit {
ngOnInit(): void {
}
- //地图范围圆圈
- circle = new AMap.Circle({
- center: [109.656839, 23.098685],
- radius: 500, //半径
- strokeOpacity: 1,
- fillOpacity: 0.4,
- strokeStyle: 'dashed',
- strokeDasharray: [10, 10],
- // 线样式还支持 'dashed'
- fillColor: '#1791fc',
- zIndex: 50,
- })
+ selectedIndex = 0
+ typedata = [
+ {name:"爆炸品",details:[
+ {name:"点火绳",englishname:"Det donating Cords",molecularformula:"无",type:"点火绳"},
+ {name:"乙二硝胺",englishname:"Ethylene Dinitramine",molecularformula:"(CH2NHNO2)2",type:"炸药及爆炸性药品"},
+ {name:"导爆锁",englishname:"Detonating Cords",molecularformula:"无",type:"起爆器材"}
+ ]},
+ {name:"气体",details:[
+ {name:"乙炔",englishname:"Acetylene",molecularformula:"C2H2",type:"易燃气体"},
+ {name:"二氟氯甲烷",englishname:"Chlorodifluoromethane",molecularformula:"CHCF2",type:"非易燃无毒气体"},
+ {name:"二氧化硫",englishname:"Sulfur die oxIde",molecularformula:"SO2",type:"毒性气体"}
+ ]},
+ {name:"易燃液体",details:[
+ {name:"2-乙基-1-丁烯",englishname:"2-Ethyl-1-butene",molecularformula:"CH3CH2(C2Hb)CCH2",type:"低闪点液体",content:[
+ {data:"2-乙基-1-丁烯"},
+ {data:"无色液体,不溶于水,能溶于乙醇丙酮和乙醚。相对密度:0.69(20℃) ,沸点:62℃ ,闪点:<-20℃, 自燃点:315℃"},
+ {data:`易燃,遇热、明火、强氧化剂,均有引起燃烧爆炸的危险。其蒸气能与空气形成爆炸性混合物,遇火星易爆炸。`},
+ {data:"泡沫、二氧化碳、干粉、1211。"},
+ {data:"储存于阴凉通风仓间内,仓温不超过30℃,远离火种、热源,防止阳光直射。应与硝酸等氧化剂分仓间储存。不宜久储,以防聚合变质。搬运时应轻装轻卸,防止包装破损。"},
+ ]},
+ {name:"2-乙基丁醛",englishname:"Diethyl Acetaldehyde",molecularformula:"C212 CHCHO",type:"中闪点液体",content:[
+ {data:"2-乙基丁醛"},
+ {data:`无色液体,不溶于水。能与乙醇、乙燃醚混溶。
+ 相对密度:0.8164(20℃)
+ 凝固点:-89℃
+ 沸点:116.8℃
+ 闪点:21.1℃(开杯
+ 爆炸极限:1.2%~7.7%
+ 蒸气压:1.827kPa(20℃)`},
+ {data:`遇明火、高温、氧化剂,有引起燃烧爆
+ 炸的危险。`},
+ {data:`泡沫、干粉、二氧化碳、砂土。`},
+ {data:`包装要密封。储存于阴凉通风
+ 的仓间内,防止阳光直射,仓温不超过30℃,远离火
+ 种、热源。应与酸类、氧化剂分仓间存放,切勿混储混
+ 运。搬运时轻装轻卸,防止包装破损。不宜久储。若
+ 触及皮肤,应及时用水冲洗。`},
+ ]},
+ {name:"乙二醇一乙醚",englishname:"Ethylene Glycol Monoethyl Ether",molecularformula:"CH2OHCH2OC2H5",type:"高闪点液体",content:[
+ {data:`乙二醇一乙醚`},
+ {data:`无色液体,几无气味。能与水和醇等
+ 大多数有机溶剂混溶。稍有毒,空气中的最高容许浓
+ 度为2.0×10-4。
+ 相对密度:0.9360(15℃)
+ 凝固点:-70
+ 沸点:135.1℃
+ 闪点:43℃
+ 自燃点:235℃
+ 爆炸极限:1.8%~14%
+ 蒸气压:506.6Pa(20℃)`},
+ {data:`遇明火、高温或氧化剂,有发生燃烧
+ 的危险。`},
+ {data:`泡沫、二氧化碳、砂土、干粉。`},
+ {data:`储存于阴凉通风仓间内,远离火
+ 种、热源。应与氧化剂分开堆放。包装要密封,防止损
+ 耗和变质。搬运时轻装轻卸,保持包装完整`},
+ ]}
+ ]},
+ {name:"易燃固体",details:[
+ {name:"N,N-二亚硝基五亚甲基四胺",englishname:"N,N- Dinitrosopentamethylene",molecularformula:"(CH2)(NO)2N",type:"一级易燃固体",content:[
+ {data:`N,N-二亚硝基五亚甲基四胺`},
+ {data:`淡黄色粉末或砂粒状固体。
易燃,有毒。易溶于丙酮,略溶于醇,微溶于氯仿,不溶于乙醚及水。
温度≥199℃时分解,与酸或酸雾接触,将迅速起火燃烧。
+ 相对密度:1.4~1.4
+ 熔点:200℃(分解)`},
+ {data:`遇高温、明火或与酸(无机酸、有机酸)接触,容易引起剧烈燃烧。与氧化剂混和,能成为爆炸性混合物`},
+ {data:"水、砂土。"},
+ {data:"储存于阴凉通风干燥的库房内。远离火种及热源。严禁与无机酸、有机酸、碱性物质、氧化剂混储混运。要经常检查同库混放物质观其性能是否抵触。储存期最长不超过6个月(自出厂日起)。搬运时应轻装轻卸,防止摩擦、撞击引起燃烧"},
+ ]},
+ {name:"2,4-二亚硝基间苯二酚",englishname:"2,4- Dinitrosores",molecularformula:"C6H2(OH)2(NO)2",type:"二级易燃固体",content:[
+ {data:`2,4-二亚硝基间苯二酚`},
+ {data:`从50%乙醇中析出者,呈黄褐色叶片
+ 状结晶。
易溶于乙醚和苯,难溶于冷水和乙醇。遇铜铁和钴盐溶液,分别显褐色、黄绿色和黄褐色。受热剧烈分解。自甲醇及水中析出者,具有1个分子结晶水,
+ 不溶于水,其熔点为162~163℃
+ 熔点:168℃
+ 自燃点:115℃`},
+ {data:`受热或与氧化剂接触,有燃烧爆炸的
+ 危险。`},
+ {data:`砂土、二氧化碳、雾状水。`},
+ {data:`储存于阴凉通风仓间内。最高仓温不宜超过30℃。远离火种及热源。应与氧化剂分仓间存放,与金属粉末及酸类隔离堆放。搬运时应轻装轻卸,防止猛撞引起爆炸。`},
+ ]},
+ {name:"乙基膦",englishname:"Ethylphosphine",molecularformula:"C2H5PH2",type:"一级易于自燃物质",content:[
+ {data:`乙基膦`},
+ {data:`无色液体。遇水分解。
+ 相对密度:<1
+ 沸点:25℃`},
+ {data:`在空气中能自燃,接触溴、氯和发烟
+ 硝酸会发生爆炸。遇浓硫酸会燃烧`},
+ {data:`干砂、干粉。禁止用水、泡沫`},
+ {data:`储存于阴凉干燥仓间内。
最高仓温不超过20℃。包装必须完整、密封,防止与空气接触。堆放时应与卤素、酸类、潮解性物质、氧化剂分开。远离火种、热源。搬运时轻装轻卸,保持包装完整。`},
+ ]}
+ ]},
+ {name:"氧化物和有机过氧化物",details:[
+ {name:"三氟化溴",englishname:"Bromine Trifluoride",molecularformula:"BrF3",type:"一级氧化性物质"},
+ {name:"三氧化铬(无水)",englishname:"Chromic Anhydride",molecularformula:"CrO3",type:"二级氧化性物质"},
+ {name:"2,5-二甲基-2,5-双",englishname:"2,5- Dimethyl-2",molecularformula:"C16H30O4",type:"有机过氧化物"}
+ ]},
+ {name:"毒性物质",details:[
+ {name:"二氧化硒",englishname:"Selenium dioxide",molecularformula:"SeO2",type:"一级无机毒性物质"},
+ {name:"一氯乙醛",englishname:"Chloroacetaldehyde",molecularformula:"C2H3OCl",type:"一级有机毒性物质"},
+ {name:"一氧化铅",englishname:"Lead Oxide",molecularformula:"PbO",type:"二级无机毒性物质"}
+ ]},
+ {name:"化学毒剂",details:[
+ {name:"二氧二甲胺基氰磷酸乙酯化硒",englishname:"Tabun",molecularformula:"(CH3)2 NPOCNO2H5O",type:"化学毒剂"}
+ ]},
+ {name:"生物战剂",details:[
+ {name:"炭疽杆菌",englishname:"Bacillus Anthracis",molecularformula:"无",type:"生物战剂"}
+ ]},
+ {name:"杂项危险物质",details:[
+ {name:"乙二醇",englishname:"Ethylene Glycol",molecularformula:"HOCH2CH2OH",type:"杂项危险物质"}
+ ]},
+ ]
+
+
+ num = 0
+ clickNode(num){
+ this.num = num
+ }
+
+
+
+
+ detaildata = this.typedata[0].details
+ selectedDiv(index,item){
+ this.selectedIndex = index
+ this.detaildata = item.details
+ }
//类型选择
istype = true//默认选择危化品类型
-
typeSelect(type){
- if(type ==1 ){
- this.istype = true
+ if(type == 1){
+ this.istype = true
}else{
this.istype = false
-
- setTimeout(() => {
- var satellite = new AMap.TileLayer.Satellite();
- var roadNet = new AMap.TileLayer.RoadNet();
- // 创建一个 icon
- var viaMarker = new AMap.Marker({
- position: new AMap.LngLat(116.38,39.92),
- // 将一张图片的地址设置为 icon
- icon: '//a.amap.com/jsapi_demos/static/demo-center/icons/dir-via-marker.png',
- // 设置了 icon 以后，设置 icon 的偏移量，以 icon 的 [center bottom] 为原点
- offset: new AMap.Pixel(-13, -30)
- });
- this.map = new AMap.Map('size',{
- center: [109.656839, 23.098685],//中心点坐标
- zoom: 16,
- layers:[
- satellite,
- // roadNet
- ]
- });
- this.circle.setMap(this.map)
- this.map.add([viaMarker]);
- // this.map.setFitView([ circle ])
- }, 0);
}
}
@@ -64,7 +153,107 @@ export class DangerousComponent implements OnInit {
closeDiv(){
this.isOpen = false
}
- openDetails(){
+
+ detailNode = null
+ openDetails(item){
+ this.detailNode = item
this.isOpen = true
+ this.num = 0
}
+
+
}
+
+
+@Component({
+ selector: 'app-gis',
+ templateUrl: './gis.html',
+ styleUrls: ['./dangerous.component.scss']
+})
+export class GisComponent implements OnInit {
+
+ constructor() { }
+ map:any //地图
+ ngOnInit(): void {
+ setTimeout(() => {
+ this.creatMap()
+ }, 0);
+ }
+
+ markerIcon = new AMap.Icon({
+ image:"//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png",
+ size: new AMap.Size(52, 52), //图标大小
+ imageSize: new AMap.Size(26,36)
+ })
+ //地图范围圆圈
+ circle = new AMap.Circle({
+ center: [109.660144, 23.100172],
+ radius: 500, //半径
+ strokeOpacity: 1,
+ fillOpacity: 0.4,
+ strokeStyle: 'dashed',
+ strokeDasharray: [10, 10],
+ // 线样式还支持 'dashed'
+ fillColor: '#1791fc',
+ zIndex: 50,
+ })
+
+ creatMap(){
+ var satellite = new AMap.TileLayer.Satellite();
+ var roadNet = new AMap.TileLayer.RoadNet();
+
+ // 创建一个 icon
+ var startIcon = new AMap.Icon({
+ // 图标尺寸
+ // size: new AMap.Size(150, 60),
+ // 图标的取图地址
+ image: '../../../assets/images/fire.png',
+ // // 图标所用图片大小
+ imageSize: new AMap.Size(60, 60),
+ // // 图标取图偏移量
+ // imageOffset: new AMap.Pixel(-9, -3)
+ });
+ var viaMarker = new AMap.Marker({
+ position: new AMap.LngLat(109.660144, 23.100172),
+ icon: startIcon,
+ offset: new AMap.Pixel(-20, -30)
+ });
+ let marker1 = new AMap.Marker({
+ icon: this.markerIcon,
+ position: [109.644436,23.101842],
+ offset: new AMap.Pixel(-7, -34)
+ });
+ let marker2 = new AMap.Marker({
+ icon: this.markerIcon,
+ position: [109.666768,23.104276],
+ offset: new AMap.Pixel(0, -20)
+ });
+ let marker3 = new AMap.Marker({
+ icon: this.markerIcon,
+ position: [109.660118,23.095472],
+ offset: new AMap.Pixel(-13, -8)
+ });
+
+ this.map = new AMap.Map('size',{
+ center: [109.661536,23.098726],//中心点坐标
+ zoom: 15.8,
+ layers:[
+ satellite,
+ roadNet
+ ]
+ });
+ this.circle.setMap(this.map);//增加范围圆圈
+ this.map.add([viaMarker]);//火源标点
+ marker1.setMap(this.map);
+ marker2.setMap(this.map);
+ marker3.setMap(this.map);
+ }
+
+ //范围选择
+ rangevalue = 500
+
+ rangeSelect(e){
+ this.circle.setRadius(Number(this.rangevalue))
+ this.circle.setMap(this.map);//增加范围圆圈
+ }
+}
\ No newline at end of file
diff --git a/src/app/ui/dangerous/gis.html b/src/app/ui/dangerous/gis.html
new file mode 100644
index 0000000..c4a8e15
--- /dev/null
+++ b/src/app/ui/dangerous/gis.html
@@ -0,0 +1,11 @@
+
+
+
+
+
+
+
+
diff --git a/src/app/ui/disposal-node/disposal-node.component.html b/src/app/ui/disposal-node/disposal-node.component.html
index 2d1a5a6..3b3975f 100644
--- a/src/app/ui/disposal-node/disposal-node.component.html
+++ b/src/app/ui/disposal-node/disposal-node.component.html
@@ -12,12 +12,35 @@
组织指挥要点
+
+
volume_up
+
+
+
+
+ settings_voice
+
+
+ 按住说话
+
+
+ search
+
+
+
+
\ No newline at end of file
diff --git a/src/app/ui/disposal-node/disposal-node.component.scss b/src/app/ui/disposal-node/disposal-node.component.scss
index 468948e..a7a769f 100644
--- a/src/app/ui/disposal-node/disposal-node.component.scss
+++ b/src/app/ui/disposal-node/disposal-node.component.scss
@@ -13,12 +13,12 @@
align-items:center;
min-height: 40px;
box-sizing: border-box;
- margin: 3px 0;
+ margin: 0 0;
.bigeditdeletebtn{
- border:1px solid #0E79A9;
+
margin-right: 0px;
- height: 80%;
+ height: 100%;
display: flex;
flex-direction: column;
// align-items:center;/*由于flex-direction: column，因此align-items代表的是水平方向*/
@@ -37,10 +37,74 @@
cursor: pointer;
//background-image: url("../../../assets/images/标签经过.png") ;
}
+ .bigTalkBox{
+ user-select: none;
+ .titleIcon{
+ font-size: 33px;
+ vertical-align: sub;
+ color: white;
+ }
+ .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;
+ 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;
+
+ }
+ }
+ }
+ }
}
//中间文字区域
.wenzi{
+ border-top:1px solid #30bbec;
overflow:auto;
height: 85%;
width: 100%;
@@ -48,6 +112,9 @@
.h3{
color: #CC5D13;
}
+
+ font-size: 20px;
+
.scrollbar{
width: 30px;
height: 300px;
diff --git a/src/app/ui/disposal-node/disposal-node.component.ts b/src/app/ui/disposal-node/disposal-node.component.ts
index c337470..7effea5 100644
--- a/src/app/ui/disposal-node/disposal-node.component.ts
+++ b/src/app/ui/disposal-node/disposal-node.component.ts
@@ -21,7 +21,11 @@ export class DisposalNodeComponent implements OnInit {
}
checkedBuildingIndex:number = -1
chooseBiaoti=1
-
+ //打开说话框
+ isOpenTalk = false
+ openTalkDiv(){
+ this.isOpenTalk = !this.isOpenTalk
+ }
//鼠标移入边框变颜色
yiru(yirunum){
var tedian=document.getElementById(yirunum)
@@ -45,8 +49,8 @@ export class DisposalNodeComponent implements OnInit {
tedian.style.border="1px solid #0E79A9"
zhuyi.style.border="1px solid #0E79A9"
chuzhi.style.border="1px solid #0E79A9"
- chuzhiYuanze+=`