diff --git a/src/app/pages/criminal-records-admin/criminal-records-admin.component.html b/src/app/pages/criminal-records-admin/criminal-records-admin.component.html
index 7311c5f..36f92e9 100644
--- a/src/app/pages/criminal-records-admin/criminal-records-admin.component.html
+++ b/src/app/pages/criminal-records-admin/criminal-records-admin.component.html
@@ -3,30 +3,32 @@
<form nz-form [formGroup]="validateForm" class="login-form" (ngSubmit)="submitForm()">
<nz-form-item class="searchParams">
<nz-form-control>
- <nz-select id="level" formControlName="level" nzPlaceHolder="请选择级别">
+ <nz-select id="level" formControlName="level" nzPlaceHolder="请选择预警级别">
<nz-option nzValue="1" nzLabel="一级"></nz-option>
<nz-option nzValue="2" nzLabel="二级"></nz-option>
<nz-option nzValue="3" nzLabel="三级"></nz-option>
+ <nz-option nzValue="4" nzLabel="四级"></nz-option>
</nz-select>
</nz-form-control>
</nz-form-item>
<nz-form-item class="searchParams">
<nz-form-control>
- <nz-select id="type" formControlName="type" nzPlaceHolder="请选择事件类型">
- <nz-option nzValue="1" nzLabel="一级"></nz-option>
- <nz-option nzValue="2" nzLabel="二级"></nz-option>
- <nz-option nzValue="3" nzLabel="三级"></nz-option>
+ <nz-select id="type" formControlName="type" nzPlaceHolder="请选择预警类型">
+ <nz-option *ngFor="let item of warningTypes" [nzValue]="item.key" [nzLabel]="item.key"></nz-option>
</nz-select>
</nz-form-control>
</nz-form-item>
<nz-form-item class="searchParams">
<nz-form-control>
- <nz-select id="site" formControlName="site" nzPlaceHolder="请选择地点">
- <nz-option nzValue="1" nzLabel="一级"></nz-option>
- <nz-option nzValue="2" nzLabel="二级"></nz-option>
- <nz-option nzValue="3" nzLabel="三级"></nz-option>
+ <nz-select id="site" formControlName="site" nzPlaceHolder="请选择站内发生区域">
+ <nz-option nzValue="出入口" nzLabel="出入口"></nz-option>
+ <nz-option nzValue="加油区" nzLabel="加油区"></nz-option>
+ <nz-option nzValue="油罐区" nzLabel="油罐区"></nz-option>
+ <nz-option nzValue="便利店" nzLabel="便利店"></nz-option>
+ <nz-option nzValue="办公区" nzLabel="办公区"></nz-option>
+ <nz-option nzValue="其他区域" nzLabel="其他区域"></nz-option>
</nz-select>
</nz-form-control>
</nz-form-item>
@@ -61,7 +63,7 @@
<div class="leftbox">
<span class="chartname">
<img src="../../../assets/images/flower.png" alt="">
- 预警事件统计
+ 预警类别统计
</span>
<div class="centerContent">
<div class="numname">预警事件总数</div>
@@ -74,7 +76,7 @@
<div class="rightbox">
<span class="chartname">
<img src="../../../assets/images/flower.png" alt="">
- 预警趋势
+ 近一个月预警统计
</span>
<div class="btnbox">
<button class="rankingBtn" *ngIf="selectedType == '排名'" nz-button (click)="echartClick2('站点排名')"
@@ -97,17 +99,20 @@
<div class="tablebox">
<div class="table">
<div nz-row class="th">
- <div nz-col nzSpan="2" style="box-sizing: border-box;padding-left: 18px;">
- 事件级别
+ <div nz-col nzSpan="1" style="text-align: right;">
+
</div>
- <div nz-col nzSpan="4">
- 事件类型
+ <div nz-col nzSpan="2">
+ 预警级别
+ </div>
+ <div nz-col nzSpan="3">
+ 预警类型
</div>
<div nz-col nzSpan="4">
所属公司
</div>
<div nz-col nzSpan="2">
- 区域
+ 管理区域
</div>
<div nz-col nzSpan="1">
@@ -116,7 +121,7 @@
加油站
</div>
<div nz-col nzSpan="3">
- 摄像头
+ 预警区域
</div>
<div nz-col nzSpan="3">
预警时间
@@ -125,12 +130,15 @@
操作
</div>
</div>
- <div class="tbody">
+ <div class="tbody" id="tbody">
<div nz-row class="tr" *ngFor="let item of list">
- <div nz-col nzSpan="2" style="box-sizing: border-box;padding-left: 18px;">
+ <div nz-col nzSpan="1" style="text-align: right;">
+ <img style="width: 36px;" src="../../../assets/images/level1.png" alt="">
+ </div>
+ <div nz-col nzSpan="2">
Ⅰ级
</div>
- <div nz-col nzSpan="4">
+ <div nz-col nzSpan="3">
日常预警行为
</div>
<div nz-col nzSpan="4">
@@ -140,13 +148,13 @@
山东-淄博
</div>
<div nz-col nzSpan="1" style="text-align: right;box-sizing: border-box;padding-right: 8px;">
- 自营
+ <span class="ziying">自营</span>
</div>
<div nz-col nzSpan="4">
中化山东省淄博市第6加油站
</div>
<div nz-col nzSpan="3">
- 加油区2号摄像头
+ 便利店
</div>
<div nz-col nzSpan="3">
2021-10-12 09:28:13
diff --git a/src/app/pages/criminal-records-admin/criminal-records-admin.component.ts b/src/app/pages/criminal-records-admin/criminal-records-admin.component.ts
index bb4723c..8d024e8 100644
--- a/src/app/pages/criminal-records-admin/criminal-records-admin.component.ts
+++ b/src/app/pages/criminal-records-admin/criminal-records-admin.component.ts
@@ -1,7 +1,11 @@
-import { Component, OnInit } from '@angular/core';
+import { HttpClient } from '@angular/common/http';
+import { Component, ElementRef, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { Router } from '@angular/router'
import * as echarts from 'echarts';
+
+import { fromEvent } from 'rxjs';
+import { debounceTime } from 'rxjs/operators';
@Component({
selector: 'app-criminal-records-admin',
templateUrl: './criminal-records-admin.component.html',
@@ -10,11 +14,72 @@ import * as echarts from 'echarts';
export class CriminalRecordsAdminComponent implements OnInit {
validateForm!: FormGroup;
- constructor(private fb: FormBuilder, private router: Router) { }
-
-
-
- mybarChart: any //柱状图
+ constructor(private element: ElementRef, private http: HttpClient, private fb: FormBuilder, private router: Router) { }
+ //饼图
+ myChart
+ option = {
+ color: ['#FF4B65', '#23D9FF', '#608AFF', '#B2FF6D', '#FFFF99', '#C4E2FC', '#FF7F00', '#0090FF', '#FFD634', '#105597', '#FF4B65', '#23D9FF', '#71FFF5', '#B2FF6D'],
+ tooltip: {
+ trigger: 'item'//触发类型
+ },
+ series: [
+ {
+ // name: 'Access From',
+ type: 'pie',
+ radius: [85, 112],//内半径外，外半径
+ left: '-30%',
+ avoidLabelOverlap: false,//防止标签重叠策略
+ label: {//每一个标签外网延伸的引导说明
+ show: false,
+ position: 'outside'
+ },
+ labelLine: {//引导线
+ show: true,
+ showAbove: true
+ },
+ emphasis: {//中间高亮区域
+ label: {
+ show: false,
+ fontSize: '40',
+ fontWeight: 'bold'
+ }
+ },
+ data: [
+ { value: 26, name: '工作人员倚靠加油机或者立柱1' },
+ { value: 86, name: '工作人员倚靠加油机或者立柱2' },
+ { value: 34, name: '工作人员倚靠加油机或者立柱3' },
+ { value: 55, name: '工作人员倚靠加油机或者立柱4' },
+ { value: 60, name: '工作人员倚靠加油机或者立柱5' },
+ { value: 26, name: '工作人员倚靠加油机或者立柱6' },
+ { value: 86, name: '工作人员倚靠加油机或者立柱7' },
+ { value: 34, name: '工作人员倚靠加油机或者立柱8' },
+ { value: 55, name: '工作人员倚靠加油机或者立柱9' },
+ { value: 60, name: '工作人员倚靠加油机或者立柱10' },
+ { value: 26, name: '工作人员倚靠加油机或者立柱11' },
+ { value: 86, name: '工作人员倚靠加油机或者立柱12' },
+ { value: 34, name: '工作人员倚靠加油机或者立柱13' },
+ { value: 55, name: '工作人员倚靠加油机或者立柱14' },
+ { value: 60, name: '工作人员倚靠加油机或者立柱15' },
+ { value: 26, name: '工作人员倚靠加油机或者立柱16' },
+ { value: 86, name: '工作人员倚靠加油机或者立柱17' },
+ { value: 34, name: '工作人员倚靠加油机或者立柱18' },
+ { value: 55, name: '工作人员倚靠加油机或者立柱19' },
+ { value: 60, name: '工作人员倚靠加油机或者立柱20' }
+ ],
+ tooltip: {//鼠标移入提示
+ position: 'right',
+ padding: [14, 19],
+ backgroundColor: 'rgba(28, 129, 218, 0.4)',
+ textStyle: {
+ color: '#fff',
+ fontSize: 12
+ }
+ }
+ }
+ ]
+ };
+ //柱状图
+ mybarChart: any
baroption = {
xAxis: {
type: 'category',
@@ -76,6 +141,9 @@ export class CriminalRecordsAdminComponent implements OnInit {
type: 'line',
symbol: 'circle',
symbolSize: 8,
+ label: {
+ show: true
+ },
itemStyle: {
color: '#fff',
shadowColor: '#fff',
@@ -101,7 +169,7 @@ export class CriminalRecordsAdminComponent implements OnInit {
},
yAxis: {
type: 'category',
- data: ['北京市第十九加油站', '北京市第十九加油站', '北京市第十九加油站', '北京市第十九加油站', '北京市第十九加油站', '北京市第十九加油站', '北京市第十九加油站', '北京市第十九加油站', '北京市第十九加油站', '北京市第十九加油站'],
+ data: ['北京市第十九加油站1', '北京市第十九加油站2', '北京市第十九加油站3', '北京市第十九加油站4', '北京市第十九加油站5', '北京市第十九加油站6', '北京市第十九加油站7', '北京市第十九加油站8', '北京市第十九加油站9', '北京市第十九加油站10', '北京市第十九加油站11', '北京市第十九加油站12', '北京市第十九加油站', '北京市第十九加油站', '北京市第十九加油站', '北京市第十九加油站', '北京市第十九加油站', '北京市第十九加油站', '北京市第十九加油站', '北京市第十九加油站20', '北京市第十九加油站21', '北京市第十九加油站22', '北京市第十九加油站23'],
axisLine: {
show: false,
lineStyle: {
@@ -132,7 +200,8 @@ export class CriminalRecordsAdminComponent implements OnInit {
shadowColor: "#fff"
}
}
- }
+ },
+ inverse: true
},
series:
@@ -144,9 +213,9 @@ export class CriminalRecordsAdminComponent implements OnInit {
color: "#fff",
fontSize: 12,
formatter: '{c}',
- offset:[6,0]
+ offset: [6, 0]
},
- data: [40, 36, 30, 25, 19, 15, 14, 11, 10, 8].reverse(),
+ data: [40, 36, 30, 25, 19, 15, 14, 11, 10, 8, 40, 36, 30, 25, 19, 15, 14, 11, 10, 8, 1, 2, 3].reverse(),
type: 'bar',
itemStyle: {
color: {
@@ -168,11 +237,35 @@ export class CriminalRecordsAdminComponent implements OnInit {
}
,
grid: {
- left: '138px',
- right: '60px',
+ left: '150px',
+ right: '80px',
bottom: '3px',
top: '20px'
- }
+ },
+ dataZoom: [ //Y轴滑动条
+ {
+ type: 'slider', //滑动条
+ show: true, //开启
+ yAxisIndex: 0,//表示控制第几个y轴
+ left: '97%', //滑动条位置
+ start: 1, //初始化时，滑动条宽度开始标度
+ end: 100, //初始化时，滑动条宽度结束标度<br>
+ maxValueSpan: 10,//显示数据的条数(默认显示10个)
+ showDataShadow: false,//是否显示数据阴影 默认auto
+ showDetail: false,//即拖拽时候是否显示详细数值信息 默认true
+ realtime: true, //是否实时更新
+ filterMode: 'filter',
+ backgroundColor:'#001735',
+ width:'18'
+ },
+ {
+ type:'inside',
+ yAxisIndex:0,
+ zoomOnMouseWheel:false, //滚轮是否触发缩放
+ moveOnMouseMove:true, //鼠标滚轮触发滚动
+ moveOnMouseWheel:true
+ }
+ ]
}
ngOnInit(): void {
this.validateForm = this.fb.group({
@@ -182,75 +275,23 @@ export class CriminalRecordsAdminComponent implements OnInit {
datePicker: [null]
});
- // 基于准备好的dom，初始化echarts实例
- let myChart = echarts.init(document.getElementById('piechart'));
- let option = {
- color: ['#FF4B65', '#23D9FF', '#608AFF', '#B2FF6D', '#FFFF99', '#C4E2FC', '#FF7F00', '#0090FF', '#FFD634', '#105597', '#FF4B65', '#23D9FF', '#71FFF5', '#B2FF6D'],
- tooltip: {
- trigger: 'item'//触发类型
- },
- series: [
- {
- // name: 'Access From',
- type: 'pie',
- radius: [85, 112],//内半径外，外半径
- left: '-30%',
- avoidLabelOverlap: false,//防止标签重叠策略
- label: {//每一个标签外网延伸的引导说明
- show: false,
- position: 'outside'
- },
- labelLine: {//引导线
- show: true,
- showAbove: true
- },
- emphasis: {//中间高亮区域
- label: {
- show: false,
- fontSize: '40',
- fontWeight: 'bold'
- }
- },
- data: [
- { value: 26, name: '工作人员倚靠加油机或者立柱1' },
- { value: 86, name: '工作人员倚靠加油机或者立柱2' },
- { value: 34, name: '工作人员倚靠加油机或者立柱3' },
- { value: 55, name: '工作人员倚靠加油机或者立柱4' },
- { value: 60, name: '工作人员倚靠加油机或者立柱5' },
- { value: 26, name: '工作人员倚靠加油机或者立柱6' },
- { value: 86, name: '工作人员倚靠加油机或者立柱7' },
- { value: 34, name: '工作人员倚靠加油机或者立柱8' },
- { value: 55, name: '工作人员倚靠加油机或者立柱9' },
- { value: 60, name: '工作人员倚靠加油机或者立柱10' },
- { value: 26, name: '工作人员倚靠加油机或者立柱11' },
- { value: 86, name: '工作人员倚靠加油机或者立柱12' },
- { value: 34, name: '工作人员倚靠加油机或者立柱13' },
- { value: 55, name: '工作人员倚靠加油机或者立柱14' },
- { value: 60, name: '工作人员倚靠加油机或者立柱15' },
- { value: 26, name: '工作人员倚靠加油机或者立柱16' },
- { value: 86, name: '工作人员倚靠加油机或者立柱17' },
- { value: 34, name: '工作人员倚靠加油机或者立柱18' },
- { value: 55, name: '工作人员倚靠加油机或者立柱19' },
- { value: 60, name: '工作人员倚靠加油机或者立柱20' }
- ],
- tooltip: {//鼠标移入提示
- position: 'right',
- padding: [14, 19],
- backgroundColor: 'rgba(28, 129, 218, 0.4)',
- textStyle: {
- color: '#fff',
- fontSize: 12
- }
- }
- }
- ]
- };
- // 绘制图表
- myChart.setOption(option);
-
+ //饼图
+ this.myChart = echarts.init(document.getElementById('piechart'));
+ this.myChart.setOption(this.option);
+ //柱状折线图
this.mybarChart = echarts.init(document.getElementById('barchart'));
-
this.mybarChart.setOption(this.baroption);
+
+ this.warningType()
+ }
+
+
+ ngAfterViewInit(): void {
+ fromEvent(this.element.nativeElement.querySelector(`#tbody`) as HTMLCanvasElement, 'scroll').pipe(debounceTime(100)).subscribe((event: any) => { //监听 DOM 滚动事件
+ if (event.target.scrollHeight - (event.target.scrollTop + event.target.clientHeight) <= 10) {
+ console.log('需要加载数据了', event)
+ }
+ });
}
getThirtyDays() {
//获取当前日期
@@ -301,7 +342,15 @@ export class CriminalRecordsAdminComponent implements OnInit {
}
}
-
+ //预警类型接口
+ warningTypes: any //预警接口数据
+ warningTypesDetails: any
+ warningType() {
+ this.http.get('/api/services/app/Violation/GetAllList').subscribe((data: any) => {
+ this.warningTypesDetails = data.result
+ this.warningTypes = (data.result as any).groupBy((t) => { return t.violationType });
+ })
+ }
list: any = [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1]
look() {
this.router.navigate(['/records/petrolStation'])
@@ -314,12 +363,12 @@ export class CriminalRecordsAdminComponent implements OnInit {
this.selectedType = type
this.mybarChart.dispose()
this.mybarChart = echarts.init(document.getElementById('barchart'));
- if(type == '排名'){
+ if (type == '排名') {
this.mybarChart.setOption(this.baroption2);
- }else{
+ } else {
this.mybarChart.setOption(this.baroption);
}
-
+
}
echartClick2(type) {
this.selectedRankingType = type
diff --git a/src/app/pages/criminal-records/criminal-records.component.html b/src/app/pages/criminal-records/criminal-records.component.html
index 815a2fb..a457144 100644
--- a/src/app/pages/criminal-records/criminal-records.component.html
+++ b/src/app/pages/criminal-records/criminal-records.component.html
@@ -3,30 +3,32 @@
<form nz-form [formGroup]="validateForm" class="login-form" (ngSubmit)="submitForm()">
<nz-form-item class="searchParams">
<nz-form-control>
- <nz-select id="level" formControlName="level" nzPlaceHolder="请选择级别">
+ <nz-select formControlName="level" nzPlaceHolder="请选择预警级别">
<nz-option nzValue="1" nzLabel="一级"></nz-option>
<nz-option nzValue="2" nzLabel="二级"></nz-option>
<nz-option nzValue="3" nzLabel="三级"></nz-option>
+ <nz-option nzValue="4" nzLabel="四级"></nz-option>
</nz-select>
</nz-form-control>
</nz-form-item>
<nz-form-item class="searchParams">
<nz-form-control>
- <nz-select id="type" formControlName="type" nzPlaceHolder="请选择事件类型">
- <nz-option nzValue="1" nzLabel="一级"></nz-option>
- <nz-option nzValue="2" nzLabel="二级"></nz-option>
- <nz-option nzValue="3" nzLabel="三级"></nz-option>
+ <nz-select formControlName="type" nzPlaceHolder="请选择预警类型">
+ <nz-option *ngFor="let item of warningTypes" [nzValue]="item.key" [nzLabel]="item.key"></nz-option>
</nz-select>
</nz-form-control>
</nz-form-item>
<nz-form-item class="searchParams">
<nz-form-control>
- <nz-select id="site" formControlName="site" nzPlaceHolder="请选择地点">
- <nz-option nzValue="1" nzLabel="一级"></nz-option>
- <nz-option nzValue="2" nzLabel="二级"></nz-option>
- <nz-option nzValue="3" nzLabel="三级"></nz-option>
+ <nz-select formControlName="site" nzPlaceHolder="请选择站内发生区域">
+ <nz-option nzValue="出入口" nzLabel="出入口"></nz-option>
+ <nz-option nzValue="加油区" nzLabel="加油区"></nz-option>
+ <nz-option nzValue="油罐区" nzLabel="油罐区"></nz-option>
+ <nz-option nzValue="便利店" nzLabel="便利店"></nz-option>
+ <nz-option nzValue="办公区" nzLabel="办公区"></nz-option>
+ <nz-option nzValue="其他区域" nzLabel="其他区域"></nz-option>
</nz-select>
</nz-form-control>
</nz-form-item>
@@ -61,7 +63,7 @@
<div class="leftbox">
<span class="chartname">
<img src="../../../assets/images/flower.png" alt="">
- 预警事件统计
+ 预警类别统计
</span>
<div class="centerContent">
<div class="numname">预警事件总数</div>
@@ -74,7 +76,7 @@
<div class="rightbox">
<span class="chartname">
<img src="../../../assets/images/flower.png" alt="">
- 预警趋势
+ 近一个月预警统计
</span>
<div class="btnbox">
<!-- <button class="rankingBtn" *ngIf="selectedType == '排名'" nz-button (click)="echartClick2('站点排名')"
@@ -97,7 +99,9 @@
<div class="tablebox">
<div class="table">
<div nz-row class="th">
- <div nz-col nzSpan="4" style="box-sizing: border-box;padding-left: 6%;">
+ <div nz-col nzSpan="1">
+ </div>
+ <div nz-col nzSpan="3">
预警级别
</div>
<div nz-col nzSpan="5">
@@ -107,7 +111,7 @@
预警信息
</div>
<div nz-col nzSpan="4">
- 摄像头
+ 预警区域
</div>
<div nz-col nzSpan="4">
预警时间
@@ -118,7 +122,10 @@
</div>
<div class="tbody">
<div nz-row class="tr" *ngFor="let item of list">
- <div nz-col nzSpan="4" style="box-sizing: border-box;padding-left: 6%;">
+ <div nz-col nzSpan="1" style="text-align: right;">
+ <img style="width: 36px;" src="../../../assets/images/level1.png" alt="">
+ </div>
+ <div nz-col nzSpan="3">
Ⅰ级
</div>
<div nz-col nzSpan="5">
@@ -128,7 +135,7 @@
工作人员倚靠加油机或立柱
</div>
<div nz-col nzSpan="4">
- 加油区2号摄像头
+ 便利店
</div>
<div nz-col nzSpan="4">
2021-10-12 09:28:13
diff --git a/src/app/pages/criminal-records/criminal-records.component.ts b/src/app/pages/criminal-records/criminal-records.component.ts
index a20a60a..e80e752 100644
--- a/src/app/pages/criminal-records/criminal-records.component.ts
+++ b/src/app/pages/criminal-records/criminal-records.component.ts
@@ -1,3 +1,4 @@
+import { HttpClient } from '@angular/common/http';
import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import * as echarts from 'echarts';
@@ -8,7 +9,72 @@ import * as echarts from 'echarts';
})
export class CriminalRecordsComponent implements OnInit {
validateForm!: FormGroup;
- constructor(private fb: FormBuilder) { }
+ constructor(private http: HttpClient, private fb: FormBuilder) { }
+
+ myChart: any //左侧饼图
+ option = {
+ color: ['#FF4B65', '#23D9FF', '#608AFF', '#B2FF6D', '#FFFF99', '#C4E2FC', '#FF7F00', '#0090FF', '#FFD634', '#105597', '#FF4B65', '#23D9FF', '#71FFF5', '#B2FF6D'],
+ tooltip: {
+ trigger: 'item'//触发类型
+ },
+ series: [
+ {
+ // name: 'Access From',
+ type: 'pie',
+ radius: [85, 112],//内半径外，外半径
+ left: '-30%',
+ avoidLabelOverlap: false,//防止标签重叠策略
+ label: {//每一个标签外网延伸的引导说明
+ show: false,
+ position: 'outside'
+ },
+ labelLine: {//引导线
+ show: true,
+ showAbove: true
+ },
+ emphasis: {//中间高亮区域
+ label: {
+ show: false,
+ fontSize: '40',
+ fontWeight: 'bold'
+ }
+ },
+ data: [
+ { value: 26, name: '工作人员倚靠加油机或者立柱1' },
+ { value: 86, name: '工作人员倚靠加油机或者立柱2' },
+ { value: 34, name: '工作人员倚靠加油机或者立柱3' },
+ { value: 55, name: '工作人员倚靠加油机或者立柱4' },
+ { value: 60, name: '工作人员倚靠加油机或者立柱5' },
+ { value: 26, name: '工作人员倚靠加油机或者立柱6' },
+ { value: 86, name: '工作人员倚靠加油机或者立柱7' },
+ { value: 34, name: '工作人员倚靠加油机或者立柱8' },
+ { value: 55, name: '工作人员倚靠加油机或者立柱9' },
+ { value: 60, name: '工作人员倚靠加油机或者立柱10' },
+ { value: 26, name: '工作人员倚靠加油机或者立柱11' },
+ { value: 86, name: '工作人员倚靠加油机或者立柱12' },
+ { value: 34, name: '工作人员倚靠加油机或者立柱13' },
+ { value: 55, name: '工作人员倚靠加油机或者立柱14' },
+ { value: 60, name: '工作人员倚靠加油机或者立柱15' },
+ { value: 26, name: '工作人员倚靠加油机或者立柱16' },
+ { value: 86, name: '工作人员倚靠加油机或者立柱17' },
+ { value: 34, name: '工作人员倚靠加油机或者立柱18' },
+ { value: 55, name: '工作人员倚靠加油机或者立柱19' },
+ { value: 60, name: '工作人员倚靠加油机或者立柱20' }
+ ],
+ tooltip: {//鼠标移入提示
+ position: 'right',
+ padding: [14, 19],
+ backgroundColor: 'rgba(28, 129, 218, 0.4)',
+ textStyle: {
+ color: '#fff',
+ fontSize: 12
+ }
+ }
+ }
+ ]
+ };
+
+
mybarChart: any //柱状图
baroption = {
xAxis: {
@@ -71,6 +137,9 @@ export class CriminalRecordsComponent implements OnInit {
type: 'line',
symbol: 'circle',
symbolSize: 8,
+ label: {
+ show: true
+ },
itemStyle: {
color: '#fff',
shadowColor: '#fff',
@@ -210,75 +279,14 @@ export class CriminalRecordsComponent implements OnInit {
site: [null],
datePicker: [null]
});
- // 基于准备好的dom，初始化echarts实例
- let myChart = echarts.init(document.getElementById('piechart'));
- let option = {
- color: ['#FF4B65', '#23D9FF', '#608AFF', '#B2FF6D', '#FFFF99', '#C4E2FC', '#FF7F00', '#0090FF', '#FFD634', '#105597', '#FF4B65', '#23D9FF', '#71FFF5', '#B2FF6D'],
- tooltip: {
- trigger: 'item'//触发类型
- },
- series: [
- {
- // name: 'Access From',
- type: 'pie',
- radius: [85, 112],//内半径外，外半径
- left: '-30%',
- avoidLabelOverlap: false,//防止标签重叠策略
- label: {//每一个标签外网延伸的引导说明
- show: false,
- position: 'outside'
- },
- labelLine: {//引导线
- show: true,
- showAbove: true
- },
- emphasis: {//中间高亮区域
- label: {
- show: false,
- fontSize: '40',
- fontWeight: 'bold'
- }
- },
- data: [
- { value: 26, name: '工作人员倚靠加油机或者立柱1' },
- { value: 86, name: '工作人员倚靠加油机或者立柱2' },
- { value: 34, name: '工作人员倚靠加油机或者立柱3' },
- { value: 55, name: '工作人员倚靠加油机或者立柱4' },
- { value: 60, name: '工作人员倚靠加油机或者立柱5' },
- { value: 26, name: '工作人员倚靠加油机或者立柱6' },
- { value: 86, name: '工作人员倚靠加油机或者立柱7' },
- { value: 34, name: '工作人员倚靠加油机或者立柱8' },
- { value: 55, name: '工作人员倚靠加油机或者立柱9' },
- { value: 60, name: '工作人员倚靠加油机或者立柱10' },
- { value: 26, name: '工作人员倚靠加油机或者立柱11' },
- { value: 86, name: '工作人员倚靠加油机或者立柱12' },
- { value: 34, name: '工作人员倚靠加油机或者立柱13' },
- { value: 55, name: '工作人员倚靠加油机或者立柱14' },
- { value: 60, name: '工作人员倚靠加油机或者立柱15' },
- { value: 26, name: '工作人员倚靠加油机或者立柱16' },
- { value: 86, name: '工作人员倚靠加油机或者立柱17' },
- { value: 34, name: '工作人员倚靠加油机或者立柱18' },
- { value: 55, name: '工作人员倚靠加油机或者立柱19' },
- { value: 60, name: '工作人员倚靠加油机或者立柱20' }
- ],
- tooltip: {//鼠标移入提示
- position: 'right',
- padding: [14, 19],
- backgroundColor: 'rgba(28, 129, 218, 0.4)',
- textStyle: {
- color: '#fff',
- fontSize: 12
- }
- }
- }
- ]
- };
- // 绘制图表
- myChart.setOption(option);
-
+ // 饼图
+ this.myChart = echarts.init(document.getElementById('piechart'));
+ this.myChart.setOption(this.option);
+ //柱状折线图
this.mybarChart = echarts.init(document.getElementById('barchart'));
-
this.mybarChart.setOption(this.baroption);
+
+ this.warningType()
}
submitForm(): void {
for (const i in this.validateForm.controls) {
@@ -298,6 +306,17 @@ export class CriminalRecordsComponent implements OnInit {
}
+ //预警类型接口
+ warningTypes: any //预警接口数据
+ warningTypesDetails: any
+ warningType() {
+ this.http.get('/api/services/app/Violation/GetAllList').subscribe((data: any) => {
+ this.warningTypesDetails = data.result
+ this.warningTypes = (data.result as any).groupBy((t) => { return t.violationType });
+ })
+ }
+
+
list: any = [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1]
selectedType = '分布'
diff --git a/src/app/pages/home/home.component.html b/src/app/pages/home/home.component.html
index 4c4d150..6702563 100644
--- a/src/app/pages/home/home.component.html
+++ b/src/app/pages/home/home.component.html
@@ -4,7 +4,7 @@
</div>
<div class="menu">
<li *ngIf="!isGasStationNav" [routerLink]="['/plan']" routerLinkActive="router-link-active">
- 数字站点
+ 数字油站
</li>
<li *ngIf="!isGasStationNav" [routerLink]="['/warning']" routerLinkActive="router-link-active">
今日预警
@@ -14,7 +14,7 @@
</li>
<li *ngIf="isGasStationNav" [routerLink]="['/plan/petrolStation']" routerLinkActive="router-link-active">
- 三维预案
+ 数字油站
</li>
<li *ngIf="isGasStationNav" [routerLink]="['/warning/petrolStation']" routerLinkActive="router-link-active">
今日预警
diff --git a/src/app/pages/login/login.component.html b/src/app/pages/login/login.component.html
index 9b48d0d..db3fe0a 100644
--- a/src/app/pages/login/login.component.html
+++ b/src/app/pages/login/login.component.html
@@ -52,7 +52,7 @@
<div class="name">
<img src="../../../assets/images/logo.png" alt="">
- <h1>中化油站</h1>
+ <h1>中化石油</h1>
<h1>智能安全管理系统</h1>
</div>
diff --git a/src/app/pages/login/login.component.ts b/src/app/pages/login/login.component.ts
index 60788b3..2252ca7 100644
--- a/src/app/pages/login/login.component.ts
+++ b/src/app/pages/login/login.component.ts
@@ -115,7 +115,7 @@ export class LoginComponent implements OnInit {
} else {
if (data.result.user.organization.isGasStation) {
sessionStorage.setItem("isGasStation", 'true');
- this.router.navigate(['/plan/petrolStation'])
+ this.router.navigate(['/warning/petrolStation'])
} else {
sessionStorage.setItem("isGasStation", 'false');
this.router.navigate(['/plan'])
diff --git a/src/app/pages/oil-station-info/oil-station-info.component.html b/src/app/pages/oil-station-info/oil-station-info.component.html
index 6491aa9..816d689 100644
--- a/src/app/pages/oil-station-info/oil-station-info.component.html
+++ b/src/app/pages/oil-station-info/oil-station-info.component.html
@@ -66,6 +66,95 @@
</nz-form-item>
</td>
</tr>
+ <tr>
+ <td class="head">区域</td>
+ <td class="text">
+ <nz-form-item>
+ <nz-form-control>
+ <nz-input-group>
+ <input [(ngModel)]="httpBody.locationName" nz-input type="text" formControlName="locationName" />
+ </nz-input-group>
+ </nz-form-control>
+ </nz-form-item>
+ </td>
+ <td class="head">所属公司</td>
+ <td class="text">
+ <nz-form-item>
+ <nz-form-control>
+ <nz-input-group>
+ <input [(ngModel)]="httpBody.companyName" nz-input type="text" formControlName="companyName" />
+ </nz-input-group>
+ </nz-form-control>
+ </nz-form-item>
+ </td>
+ </tr>
+ <tr>
+ <td class="head">联系人</td>
+ <td class="text">
+ <nz-form-item>
+ <nz-form-control>
+ <nz-input-group>
+ <input [(ngModel)]="httpBody.leaderName" nz-input type="text" formControlName="leaderName" />
+ </nz-input-group>
+ </nz-form-control>
+ </nz-form-item>
+ </td>
+ <td class="head">联系电话</td>
+ <td class="text">
+ <nz-form-item>
+ <nz-form-control>
+ <nz-input-group>
+ <input [(ngModel)]="httpBody.leaderContact" nz-input type="text"
+ formControlName="leaderContact" />
+ </nz-input-group>
+ </nz-form-control>
+ </nz-form-item>
+ </td>
+ </tr>
+ <tr>
+ <td class="head">油站等级</td>
+ <td class="text">
+ <nz-form-item>
+ <nz-form-control>
+ <nz-input-group>
+ <input [(ngModel)]="httpBody.stationLevel" nz-input type="text" formControlName="stationLevel" />
+ </nz-input-group>
+ </nz-form-control>
+ </nz-form-item>
+ </td>
+ <td class="head">经营品种</td>
+ <td class="text">
+ <nz-form-item>
+ <nz-form-control>
+ <nz-input-group>
+ <input [(ngModel)]="httpBody.sellVariety" nz-input type="text" formControlName="sellVariety" />
+ </nz-input-group>
+ </nz-form-control>
+ </nz-form-item>
+ </td>
+ </tr>
+ <tr>
+ <td class="head">油机数量</td>
+ <td class="text">
+ <nz-form-item>
+ <nz-form-control>
+ <nz-input-group>
+ <input [(ngModel)]="httpBody.gasStationCount" nz-input type="text" formControlName="gasStationCount" />
+ </nz-input-group>
+ </nz-form-control>
+ </nz-form-item>
+ </td>
+ <td class="head">油罐容积</td>
+ <td class="text">
+ <nz-form-item>
+ <nz-form-control>
+ <nz-input-group>
+ <input [(ngModel)]="httpBody.tankVolume" nz-input type="text" formControlName="tankVolume" />
+ </nz-input-group>
+ </nz-form-control>
+ </nz-form-item>
+ </td>
+ </tr>
</table>
<table formGroupName="policeStation">
<tr>
@@ -106,7 +195,8 @@
<nz-form-item>
<nz-form-control>
<nz-input-group>
- <input [(ngModel)]="policeStation.contactInformation" nz-input type="text" formControlName="contactInformation" />
+ <input [(ngModel)]="policeStation.contactInformation" nz-input type="text"
+ formControlName="contactInformation" />
</nz-input-group>
</nz-form-control>
</nz-form-item>
@@ -152,7 +242,8 @@
<nz-form-item>
<nz-form-control>
<nz-input-group>
- <input [(ngModel)]="hospital.contactInformation" nz-input type="text" formControlName="contactInformation" />
+ <input [(ngModel)]="hospital.contactInformation" nz-input type="text"
+ formControlName="contactInformation" />
</nz-input-group>
</nz-form-control>
</nz-form-item>
@@ -198,7 +289,8 @@
<nz-form-item>
<nz-form-control>
<nz-input-group>
- <input [(ngModel)]="fireBrigade.contactInformation" nz-input type="text" formControlName="contactInformation" />
+ <input [(ngModel)]="fireBrigade.contactInformation" nz-input type="text"
+ formControlName="contactInformation" />
</nz-input-group>
</nz-form-control>
</nz-form-item>
@@ -272,7 +364,7 @@
</table>
</div>
<div class="btnbox">
- <button [nzLoading]="isLoadingSave" nz-button type="submit">保存</button>
+ <button [nzLoading]="isLoadingSave" nz-button type="submit">保存</button>
<button nz-button type="button"><img style="vertical-align: top;margin-right: 6px;"
src="../../../assets/images/excel.png" alt=""> 导出Excel</button>
</div>
diff --git a/src/app/pages/oil-station-info/oil-station-info.component.ts b/src/app/pages/oil-station-info/oil-station-info.component.ts
index 0b917eb..98d8c61 100644
--- a/src/app/pages/oil-station-info/oil-station-info.component.ts
+++ b/src/app/pages/oil-station-info/oil-station-info.component.ts
@@ -26,7 +26,15 @@ export class OilStationInfoComponent implements OnInit {
oilStationType: [null],
laneNumber: [null],
address: [null],
- validityTime: [null, [Validators.required]]//营业执照有效期
+ validityTime: [null, [Validators.required]],//营业执照有效期
+ locationName: [null],
+ companyName: [null],
+ leaderName: [null],
+ leaderContact: [null],
+ stationLevel: [null],
+ sellVariety: [null],
+ gasStationCount: [null],
+ tankVolume: [null],
}),
policeStation: this.fb.group({
name: [null],
@@ -66,16 +74,20 @@ export class OilStationInfoComponent implements OnInit {
}
}).subscribe((data: any) => {
console.log('油站信息', data)
- this.httpBody = data.result
- this.httpBody.govUnitDetail = JSON.parse(data.result.govUnitDetail)
- this.policeStation = data.result.govUnitDetail.policeStation
- this.hospital = data.result.govUnitDetail.hospital
- this.fireBrigade = data.result.govUnitDetail.fireBrigade
- this.httpBody.stationType = String(this.httpBody.stationType)
- this.validityTime[0] = data.result.validityStartTime
- this.validityTime[1] = data.result.validityEndTime
- this.validityTime = [...this.validityTime]
- console.log(this.validityTime)
+
+ if (this.httpBody.govUnitDetail) {
+ this.httpBody = data.result
+ this.httpBody.govUnitDetail = JSON.parse(data.result.govUnitDetail)
+ this.policeStation = data.result.govUnitDetail.policeStation
+ this.hospital = data.result.govUnitDetail.hospital
+ this.fireBrigade = data.result.govUnitDetail.fireBrigade
+ this.httpBody.stationType = String(this.httpBody.stationType)
+ this.validityTime[0] = data.result.validityStartTime
+ this.validityTime[1] = data.result.validityEndTime
+ this.validityTime = [...this.validityTime]
+ } else {
+ this.httpBody.id = data.result.id
+ }
setTimeout(() => {
this.gallery = new Viewer(document.getElementById('images'), {
show: () => { // 动态加载图片后，更新实例
@@ -119,6 +131,14 @@ export class OilStationInfoComponent implements OnInit {
stationType: '',
laneCount: '',
address: '',
+ locationName: '',
+ companyName: '',
+ leaderName: '',
+ leaderContact: '',
+ stationLevel: '',
+ sellVariety: '',
+ gasStationCount: '',
+ tankVolume: '',
govUnitDetail: {
policeStation: {},
hospital: {},
diff --git a/src/app/pages/pages.module.ts b/src/app/pages/pages.module.ts
index 0a9396d..c30a97f 100644
--- a/src/app/pages/pages.module.ts
+++ b/src/app/pages/pages.module.ts
@@ -42,14 +42,13 @@ import { EditequipmentComponent } from './equipment-info/editequipment/editequip
import { NzTreeSelectModule } from 'ng-zorro-antd/tree-select';
import { PlanAdminComponent } from './plan-admin/plan-admin.component';
import { GetOutOfLineDetailsComponent } from './today-warning/get-out-of-line-details/get-out-of-line-details.component';
-import { WarningDetailsComponent } from './today-warning-admin/warning-details/warning-details.component';
import { NzTableModule } from 'ng-zorro-antd/table';
import { NzCheckboxModule } from 'ng-zorro-antd/checkbox';
-
+import { NzTimePickerModule } from 'ng-zorro-antd/time-picker';
@NgModule({
declarations: [LoginComponent, RegisterComponent, HomeComponent, PlanComponent, TodayWarningComponent, CriminalRecordsComponent,
TodayWarningAdminComponent, CriminalRecordsAdminComponent, LeftDomainComponent, EquipmentInfoComponent, OilStationInfoComponent,
- AddequipmentComponent, EditequipmentComponent,PlanAdminComponent, GetOutOfLineDetailsComponent, WarningDetailsComponent],
+ AddequipmentComponent, EditequipmentComponent,PlanAdminComponent, GetOutOfLineDetailsComponent],
imports: [
@@ -83,7 +82,8 @@ import { NzCheckboxModule } from 'ng-zorro-antd/checkbox';
NzCollapseModule,
NzStepsModule,
NzTableModule,
- NzCheckboxModule
+ NzCheckboxModule,
+ NzTimePickerModule
],
entryComponents: [AddequipmentComponent, EditequipmentComponent,GetOutOfLineDetailsComponent],
schemas: [CUSTOM_ELEMENTS_SCHEMA]
diff --git a/src/app/pages/plan-admin/plan-admin.component.html b/src/app/pages/plan-admin/plan-admin.component.html
index 941d2d1..8039995 100644
--- a/src/app/pages/plan-admin/plan-admin.component.html
+++ b/src/app/pages/plan-admin/plan-admin.component.html
@@ -5,7 +5,7 @@
<app-title [name]="'组织机构'"></app-title>
</div>
<div class="or">
- <nz-tree [nzExpandedKeys]="nzExpandedKeys" [nzShowExpand]="false" #nzTreeComponent [nzExpandAll]="nzExpandAll"
+ <nz-tree [nzExpandedKeys]="nzExpandedKeys" [nzSelectedKeys]="nzSelectedKeys" [nzShowExpand]="false" #nzTreeComponent [nzExpandAll]="nzExpandAll"
nzBlockNode [nzData]="nodes" (nzClick)="activeNode($event)" [nzTreeTemplate]="nzTreeTemplate"
[nzMultiple]="false"></nz-tree>
<ng-template #nzTreeTemplate let-node let-origin="origin">
@@ -50,9 +50,9 @@
</nz-form-item>
</form>
</div>
- <div class="tablebox">
+ <div class="tablebox" id="tablebox">
- <nz-table #basicTable [nzData]="list" [nzShowPagination]="false">
+ <nz-table [nzPageSize]='999' #headerTable [nzData]="list" [nzShowPagination]="false" [nzScroll]="{ y:tableheight() }">
<thead>
<tr>
<th style="text-align: center;">加油站名称</th>
@@ -68,30 +68,32 @@
<th>操作</th>
</tr>
</thead>
- <tbody>
- <tr *ngFor="let data of basicTable.data">
- <th style="text-align: center;">加油站名称</th>
- <th>区域</th>
- <th>所属公司</th>
- <th>联系人</th>
- <th>联系电话</th>
- <th>油站等级</th>
- <th>经营品类</th>
- <th>油机数量</th>
- <th>车道数量</th>
- <th>油罐容积</th>
- <th class="look" (click)="look()" style="cursor:pointer;color: #36A2FF">查看</th>
+ <tbody id="table">
+ <tr *ngFor="let item of headerTable.data;let key = index">
+ <th style="text-align: center;">{{item.stationName}}</th>
+ <th>{{item.locationName}}</th>
+ <th>{{item.companyName}}</th>
+ <th>{{item.leaderName}}</th>
+ <th>{{item.leaderContact}}</th>
+ <th>{{item.stationLevel}}</th>
+ <th>{{item.sellVariety}}</th>
+ <th>{{item.gasStationCount}}</th>
+ <th>{{item.laneCount}}</th>
+ <th>{{item.tankVolume}}</th>
+ <th>
+ <span class="look" (click)="look()" style="cursor:pointer;color: #36A2FF">查看</span>
+ </th>
</tr>
</tbody>
</nz-table>
-
+<!--
<div class="pagination">
<nz-pagination [nzPageIndex]="1" [nzTotal]="85" [nzPageSize]="20" [nzShowTotal]="totalTemplate"
nzShowQuickJumper></nz-pagination>
<ng-template #totalTemplate let-total> 16条/页,共100条 </ng-template>
- </div>
+ </div> -->
</div>
</div>
</div>
diff --git a/src/app/pages/plan-admin/plan-admin.component.ts b/src/app/pages/plan-admin/plan-admin.component.ts
index 8ecf84e..ec73cbf 100644
--- a/src/app/pages/plan-admin/plan-admin.component.ts
+++ b/src/app/pages/plan-admin/plan-admin.component.ts
@@ -1,4 +1,4 @@
-import { Component, OnInit, ViewChild } from '@angular/core';
+import { Component, OnInit, ViewChild, ElementRef } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { TreeService } from 'src/app/service/tree.service';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
@@ -6,6 +6,8 @@ import { NzContextMenuService, NzDropdownMenuComponent } from 'ng-zorro-antd/dro
import { NzFormatEmitEvent, NzTreeComponent, NzTreeNode } from 'ng-zorro-antd/tree';
import { Router } from '@angular/router';
import { NavChangeService } from 'src/app/service/navChange.service';
+import { fromEvent } from 'rxjs';
+import { debounceTime } from 'rxjs/operators';
@Component({
selector: 'app-plan-admin',
templateUrl: './plan-admin.component.html',
@@ -14,21 +16,44 @@ import { NavChangeService } from 'src/app/service/navChange.service';
export class PlanAdminComponent implements OnInit {
validateForm!: FormGroup;
@ViewChild('nzTreeComponent', { static: false }) nzTreeComponent!: NzTreeComponent;
- constructor(private navChangeService: NavChangeService, private http: HttpClient, private toTree: TreeService, private fb: FormBuilder, private nzContextMenuService: NzContextMenuService, private router: Router) { }
- list: any = [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1]
+ constructor(private element: ElementRef, private navChangeService: NavChangeService, private http: HttpClient, private toTree: TreeService, private fb: FormBuilder, private nzContextMenuService: NzContextMenuService, private router: Router) { }
+ list: any = []
+
+ tableHeight
ngOnInit(): void {
this.validateForm = this.fb.group({
- name: [null],
- linkman: [null],
- phone: [null]
+ name: [null]
});
this.getAllOrganization()
+
+ }
+
+ ngAfterViewInit(): void {
+ fromEvent(this.element.nativeElement.querySelector(`.ant-table-body`) as HTMLCanvasElement, 'scroll').pipe(debounceTime(100)).subscribe(async (event: any) => { //监听 DOM 滚动事件
+ if (event.target.scrollHeight - (event.target.scrollTop + event.target.clientHeight) <= 10) {
+ console.log('需要加载数据了', event)
+ this.SkipCount += 100
+ await this.getGasStation()
+ }
+ });
}
submitForm(): void {
for (const i in this.validateForm.controls) {
this.validateForm.controls[i].markAsDirty();
this.validateForm.controls[i].updateValueAndValidity();
}
+ let params = {
+ StationName: this.validateForm.value.name,
+ OrganizationUnitId: String(this.OrganizationUnitId),
+ IsContainsChildren: 'true',
+ SkipCount: '0',
+ MaxResultCount: this.MaxResultCount
+ }
+ this.http.get('/api/services/app/GasStation/GetAll', {
+ params: params
+ }).subscribe((data: any) => {
+ this.list = [...data.result.items]
+ })
}
resetForm(e: MouseEvent): void {
e.preventDefault();
@@ -37,21 +62,40 @@ export class PlanAdminComponent implements OnInit {
this.validateForm.controls[key].markAsPristine();
this.validateForm.controls[key].updateValueAndValidity();
}
+ let params = {
+ StationName: this.validateForm.value.name,
+ OrganizationUnitId: String(this.OrganizationUnitId),
+ IsContainsChildren: 'true',
+ SkipCount: '0',
+ MaxResultCount: this.MaxResultCount
+ }
+ this.http.get('/api/services/app/GasStation/GetAll', {
+ params: params
+ }).subscribe((data: any) => {
+ this.list = [...data.result.items]
+ })
}
//获取所有组织机构
nodes: any = []
nzExpandAll = false
+ nzSelectedKeys: any = []
getAllOrganization() {
+ let OrganizationUnitId = sessionStorage.getItem('isGasStation') == 'true' ? JSON.parse(sessionStorage.getItem('userdataOfgasstation')).organization.id : JSON.parse(sessionStorage.getItem('userdata')).organization.id
+ let params = {
+ OrganizationUnitId: OrganizationUnitId,
+ IsContainsChildren: "false"
+ }
this.http.get('/api/services/app/Organization/GetAll', {
- params: {
- SkipCount: '0',
- MaxResultCount: '9999'
- }
+ params: params
}).subscribe((data: any) => {
-
- data.result.items = data.result.items.filter((item, i) => {
- return !item.isGasStation
- })
+ data.result.items.forEach(element => {
+ if (element.id == OrganizationUnitId) {
+ element.parentId = null
+ }
+ });
+ // data.result.items = data.result.items.filter((item, i) => {
+ // return !item.isGasStation
+ // })
for (let index = 0; index < data.result.items.length; index++) {
const element = data.result.items[index];
element.key = element.id
@@ -59,26 +103,63 @@ export class PlanAdminComponent implements OnInit {
}
this.nodes = [...this.toTree.toTree(data.result.items)]
+ this.nzSelectedKeys = [OrganizationUnitId]
+ this.OrganizationUnitId = OrganizationUnitId
this.nzExpandAll = true
+ this.getGasStation()
})
}
+
+ tableheight() {
+ return (document.getElementById('tablebox').clientHeight - 42) + 'px'
+ }
+
look() {
this.router.navigate(['/plan/petrolStation'])
-
let obj = {
name: 'oilstation'
}
this.navChangeService.sendMessage(obj);//发布一条消息
}
+
nzExpandedKeys: any = []
activatedNode?: NzTreeNode;
//点击tree节点
activeNode(data: NzFormatEmitEvent): void {
this.activatedNode = data.node!;
- // console.log(data)
+ console.log(data)
+ this.OrganizationUnitId = data.node.origin.id
+ this.getGasStation()
+ }
+
+
+ //获取点击组织机构的所有加油站
+ SkipCount: string = '0'
+ MaxResultCount: string = '100'
+ OrganizationUnitId: any
+ async getGasStation() {
+ let params = {
+ StationName: this.validateForm.value.name,
+ OrganizationUnitId: String(this.OrganizationUnitId),
+ IsContainsChildren: 'true',
+ SkipCount: this.SkipCount,
+ MaxResultCount: this.MaxResultCount
+ }
+ await new Promise((resolve, reject) => {
+ this.http.get('/api/services/app/GasStation/GetAll', {
+ params: params
+ }).subscribe((data: any) => {
+ this.list = this.list.concat(data.result.items);
+ this.list = [...this.list]
+ resolve(data)
+ console.log(999999, data)
+ })
+ })
}
+
+
expand(e, node) {
e.stopPropagation()
node.isExpanded = !node.isExpanded
diff --git a/src/app/pages/today-warning-admin/today-warning-admin.component.html b/src/app/pages/today-warning-admin/today-warning-admin.component.html
index 27a0dfc..521910f 100644
--- a/src/app/pages/today-warning-admin/today-warning-admin.component.html
+++ b/src/app/pages/today-warning-admin/today-warning-admin.component.html
@@ -55,7 +55,13 @@
<nz-form-item class="searchParams">
<nz-form-control>
- <nz-range-picker formControlName="datePicker"></nz-range-picker>
+ <nz-time-picker nzPlaceHolder="请选择开始时间" formControlName="datePickerStart" nzFormat="HH:mm"></nz-time-picker>
+ </nz-form-control>
+ </nz-form-item>
+ <i style="display: flex;align-items: center;color: #fff;" nz-icon nzType="swap-right" nzTheme="outline"></i>
+ <nz-form-item class="searchParams">
+ <nz-form-control>
+ <nz-time-picker nzPlaceHolder="请选择结束时间" formControlName="datePickerEnd" nzFormat="HH:mm"></nz-time-picker>
</nz-form-control>
</nz-form-item>
@@ -75,20 +81,26 @@
</div>
<div class="listbox">
<div nz-row class="listitem listitemhead">
- <div nz-col nzSpan="3" style="box-sizing: border-box;padding-left: 10px;">
+ <div nz-col nzSpan="2" style="box-sizing: border-box;padding-left: 10px;">
预警级别
</div>
<div nz-col nzSpan="3">
预警类型
</div>
- <div nz-col nzSpan="6">
- 预警事件
+ <div nz-col nzSpan="4">
+ 预警信息
+ </div>
+ <div nz-col nzSpan="2">
+ 所属公司
+ </div>
+ <div nz-col nzSpan="2">
+ 管理区域
</div>
<div nz-col nzSpan="3">
油站名称
</div>
- <div nz-col nzSpan="3">
- 区域
+ <div nz-col nzSpan="2">
+ 预警区域
</div>
<div nz-col nzSpan="4">
预警时间
@@ -98,7 +110,7 @@
</div>
</div>
<div nz-row class="listitem" *ngFor="let item of list">
- <div nz-col nzSpan="3">
+ <div nz-col nzSpan="2">
<span *ngIf="item.violation.violationType == '卸油作业检查'">
<img src="../../../assets/images/warning2.png">
</span>
@@ -128,13 +140,19 @@
<div nz-col nzSpan="3">
{{item.violation.violationType}}
</div>
- <div nz-col nzSpan="6">
+ <div nz-col nzSpan="4">
{{item.violation.violationName}}
</div>
+ <div nz-col nzSpan="2">
+ {{item.gasStation.companyName}}
+ </div>
+ <div nz-col nzSpan="2">
+ {{item.gasStation.locationName}}
+ </div>
<div nz-col nzSpan="3">
{{item.gasStation.stationName}}
</div>
- <div nz-col nzSpan="3">
+ <div nz-col nzSpan="2">
{{item.violateArea}}
</div>
<div nz-col nzSpan="4">
diff --git a/src/app/pages/today-warning-admin/today-warning-admin.component.scss b/src/app/pages/today-warning-admin/today-warning-admin.component.scss
index 2d1bdf1..76334d8 100644
--- a/src/app/pages/today-warning-admin/today-warning-admin.component.scss
+++ b/src/app/pages/today-warning-admin/today-warning-admin.component.scss
@@ -27,7 +27,7 @@
justify-content: space-around;
.searchParams {
- width: 14.6%;
+ width: 12.5%;
}
.btn {
@@ -41,12 +41,7 @@
nz-tree-select{
color: rgba(145, 204, 255, 0.95);
}
-
- nz-date-picker {
- background-color: rgba(0, 0, 0, 0);
- width: 145%;
- }
- nz-range-picker {
+ nz-time-picker {
background-color: rgba(0, 0, 0, 0);
width: 100%;
}
diff --git a/src/app/pages/today-warning-admin/today-warning-admin.component.ts b/src/app/pages/today-warning-admin/today-warning-admin.component.ts
index 51e5ec4..5ddb301 100644
--- a/src/app/pages/today-warning-admin/today-warning-admin.component.ts
+++ b/src/app/pages/today-warning-admin/today-warning-admin.component.ts
@@ -29,7 +29,8 @@ export class TodayWarningAdminComponent implements OnInit {
event: [null],
organization: [null],
area: [null],
- datePicker: [null]
+ datePickerStart: [new Date(`${moment(new Date()).format('YYYY-MM-DD')} 00:00`)],
+ datePickerEnd: [new Date(`${moment(new Date()).format('YYYY-MM-DD')} 23:59`)]
});
this.warningType()
this.getAllOrganization()
@@ -37,21 +38,21 @@ export class TodayWarningAdminComponent implements OnInit {
//预警类型接口
warningTypes: any //预警接口数据
- warningTypesDetails:any
+ warningTypesDetails: any
warningType() {
this.http.get('/api/services/app/Violation/GetAllList').subscribe((data: any) => {
this.warningTypesDetails = data.result
this.warningTypes = (data.result as any).groupBy((t) => { return t.violationType });
})
}
- typeChange(e){
+ typeChange(e) {
this.warningTypes.forEach(element => {
- if(element.key == e){
+ if (element.key == e) {
this.warningTypesDetails = element
}
});
this.validateForm.patchValue({
- event: null,
+ event: null,
});
}
@@ -59,8 +60,18 @@ export class TodayWarningAdminComponent implements OnInit {
//获取所有组织机构
nodes: any = []
getAllOrganization() {
- this.http.get('/api/services/app/Organization/GetAll').subscribe((data: any) => {
+ let OrganizationUnitId = sessionStorage.getItem('isGasStation') == 'true' ? JSON.parse(sessionStorage.getItem('userdataOfgasstation')).organization.id : JSON.parse(sessionStorage.getItem('userdata')).organization.id
+ let params = {
+ OrganizationUnitId: OrganizationUnitId,
+ IsContainsChildren: "true"
+ }
+ this.http.get('/api/services/app/Organization/GetAll', {
+ params: params
+ }).subscribe((data: any) => {
data.result.items.forEach(element => {
+ if (element.id == OrganizationUnitId) {
+ element.parentId = null
+ }
element.key = element.id
element.title = element.displayName
});
@@ -78,20 +89,22 @@ export class TodayWarningAdminComponent implements OnInit {
totalCount: string //预警总数
getEarlyWarningList() {
let ViolationIds = []
- if(this.validateForm.value.event){
+ if (this.validateForm.value.event) {
ViolationIds.push(this.validateForm.value.event)
}
- if(this.validateForm.value.type && !this.validateForm.value.event){
+ if (this.validateForm.value.type && !this.validateForm.value.event) {
this.warningTypesDetails.forEach(item => {
item.id ? ViolationIds.push(item.id) : null
});
}
+
+ console.log(this.validateForm.value)
let params = {
Level: this.validateForm.value.level,
ViolationIds: ViolationIds,
ViolateArea: this.validateForm.value.area,
organizationUnitId: this.validateForm.value.organization,
- ViolateTime: this.validateForm.value.datePicker ? [moment(this.validateForm.value.datePicker[0]).format('YYYY-MM-DD'), moment(this.validateForm.value.datePicker[1]).format('YYYY-MM-DD')] : null,
+ ViolateTime: (this.validateForm.value.datePickerEnd && this.validateForm.value.datePickerStart) ? [moment(this.validateForm.value.datePickerStart).format('yyyy-MM-DD HH:mm:ss'), moment(this.validateForm.value.datePickerEnd).format('yyyy-MM-DD HH:mm:ss')] : null,
SkipCount: '0',
MaxResultCount: '9999'
}
@@ -110,7 +123,7 @@ export class TodayWarningAdminComponent implements OnInit {
console.log('走这里了')
this.navChangeService.sendMessage(obj);//发布一条消息
}, 0);
-
+
})
}
@@ -131,8 +144,11 @@ export class TodayWarningAdminComponent implements OnInit {
this.validateForm.controls[key].markAsPristine();
this.validateForm.controls[key].updateValueAndValidity();
}
- this.defaultOrId = JSON.parse(sessionStorage.getItem('userdata')).organization.id
- this.validateForm.value.organization = this.defaultOrId
+ this.validateForm.patchValue({
+ organization: JSON.parse(sessionStorage.getItem('userdata')).organization.id,
+ datePickerStart: new Date(`${moment(new Date()).format('YYYY-MM-DD')} 00:00`),
+ datePickerEnd: new Date(`${moment(new Date()).format('YYYY-MM-DD')} 23:59`)
+ });
this.getEarlyWarningList()
}
diff --git a/src/app/pages/today-warning-admin/warning-details/warning-details.component.html b/src/app/pages/today-warning-admin/warning-details/warning-details.component.html
deleted file mode 100644
index e69de29..0000000
diff --git a/src/app/pages/today-warning-admin/warning-details/warning-details.component.scss b/src/app/pages/today-warning-admin/warning-details/warning-details.component.scss
deleted file mode 100644
index e69de29..0000000
diff --git a/src/app/pages/today-warning-admin/warning-details/warning-details.component.spec.ts b/src/app/pages/today-warning-admin/warning-details/warning-details.component.spec.ts
deleted file mode 100644
index 3e13d28..0000000
--- a/src/app/pages/today-warning-admin/warning-details/warning-details.component.spec.ts
+++ /dev/null
@@ -1,25 +0,0 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { WarningDetailsComponent } from './warning-details.component';
-
-describe('WarningDetailsComponent', () => {
- let component: WarningDetailsComponent;
- let fixture: ComponentFixture<WarningDetailsComponent>;
-
- beforeEach(async(() => {
- TestBed.configureTestingModule({
- declarations: [ WarningDetailsComponent ]
- })
- .compileComponents();
- }));
-
- beforeEach(() => {
- fixture = TestBed.createComponent(WarningDetailsComponent);
- component = fixture.componentInstance;
- fixture.detectChanges();
- });
-
- it('should create', () => {
- expect(component).toBeTruthy();
- });
-});
diff --git a/src/app/pages/today-warning-admin/warning-details/warning-details.component.ts b/src/app/pages/today-warning-admin/warning-details/warning-details.component.ts
deleted file mode 100644
index bcb568b..0000000
--- a/src/app/pages/today-warning-admin/warning-details/warning-details.component.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-
-@Component({
- selector: 'app-warning-details',
- templateUrl: './warning-details.component.html',
- styleUrls: ['./warning-details.component.scss']
-})
-export class WarningDetailsComponent implements OnInit {
-
- constructor() { }
-
- ngOnInit(): void {
- }
-
-}
diff --git a/src/app/pages/today-warning/today-warning.component.html b/src/app/pages/today-warning/today-warning.component.html
index e2959f9..3110598 100644
--- a/src/app/pages/today-warning/today-warning.component.html
+++ b/src/app/pages/today-warning/today-warning.component.html
@@ -38,7 +38,13 @@
<nz-form-item class="searchParams">
<nz-form-control>
- <nz-range-picker formControlName="datePicker"></nz-range-picker>
+ <nz-time-picker nzPlaceHolder="请选择开始时间" formControlName="datePickerStart" nzFormat="HH:mm"></nz-time-picker>
+ </nz-form-control>
+ </nz-form-item>
+ <i style="display: flex;align-items: center;color: #fff;" nz-icon nzType="swap-right" nzTheme="outline"></i>
+ <nz-form-item class="searchParams">
+ <nz-form-control>
+ <nz-time-picker nzPlaceHolder="请选择结束时间" formControlName="datePickerEnd" nzFormat="HH:mm"></nz-time-picker>
</nz-form-control>
</nz-form-item>
@@ -88,10 +94,10 @@
</span>
</div>
<div nz-col nzSpan="4">
- 事件类型: {{item.violation.violationType}}
+ 预警类型: {{item.violation.violationType}}
</div>
<div nz-col nzSpan="5">
- 事件信息: {{item.violation.violationName}}
+ 预警信息: {{item.violation.violationName}}
</div>
<div nz-col nzSpan="5">
区域: {{item.violateArea}}
diff --git a/src/app/pages/today-warning/today-warning.component.scss b/src/app/pages/today-warning/today-warning.component.scss
index 412dff8..1c6c02c 100644
--- a/src/app/pages/today-warning/today-warning.component.scss
+++ b/src/app/pages/today-warning/today-warning.component.scss
@@ -27,7 +27,7 @@
justify-content: space-around;
.searchParams {
- width: 22%;
+ width: 17.5%;
}
.btn {
@@ -38,12 +38,7 @@
color: rgba(145, 204, 255, 0.95);
}
- nz-date-picker {
- background-color: rgba(0, 0, 0, 0);
- width: 100%;
- }
-
- nz-range-picker {
+ nz-time-picker {
background-color: rgba(0, 0, 0, 0);
width: 100%;
}
diff --git a/src/app/pages/today-warning/today-warning.component.ts b/src/app/pages/today-warning/today-warning.component.ts
index 9dd0a96..32b412e 100644
--- a/src/app/pages/today-warning/today-warning.component.ts
+++ b/src/app/pages/today-warning/today-warning.component.ts
@@ -20,7 +20,8 @@ export class TodayWarningComponent implements OnInit {
level: [null],
type: [null],
area: [null],
- datePicker: [null]
+ datePickerStart: [new Date(`${moment(new Date()).format('YYYY-MM-DD')} 00:00`)],
+ datePickerEnd: [new Date(`${moment(new Date()).format('YYYY-MM-DD')} 23:59`)]
});
this.warningType()
this.getEarlyWarningList()
@@ -50,7 +51,7 @@ export class TodayWarningComponent implements OnInit {
totalCount: string //预警总数
getEarlyWarningList() {
let ViolationIds = []
- if(this.validateForm.value.type){
+ if (this.validateForm.value.type) {
this.warningTypesDetails.forEach(item => {
item.id ? ViolationIds.push(item.id) : null
});
@@ -59,8 +60,8 @@ export class TodayWarningComponent implements OnInit {
Level: this.validateForm.value.level,
ViolationIds: ViolationIds,
ViolateArea: this.validateForm.value.area,
- organizationUnitId: JSON.parse(sessionStorage.getItem('userdataOfgasstation')).organization.id ,
- ViolateTime: this.validateForm.value.datePicker ? [moment(this.validateForm.value.datePicker[0]).format('YYYY-MM-DD'), moment(this.validateForm.value.datePicker[1]).format('YYYY-MM-DD')] : null,
+ organizationUnitId: JSON.parse(sessionStorage.getItem('userdataOfgasstation')).organization.id,
+ ViolateTime: (this.validateForm.value.datePickerEnd && this.validateForm.value.datePickerStart) ? [moment(this.validateForm.value.datePickerStart).format('yyyy-MM-DD HH:mm:ss'), moment(this.validateForm.value.datePickerEnd).format('yyyy-MM-DD HH:mm:ss')] : null,
SkipCount: '0',
MaxResultCount: '9999'
}
@@ -96,6 +97,10 @@ export class TodayWarningComponent implements OnInit {
this.validateForm.controls[key].markAsPristine();
this.validateForm.controls[key].updateValueAndValidity();
}
+ this.validateForm.patchValue({
+ datePickerStart: new Date(`${moment(new Date()).format('YYYY-MM-DD')} 00:00`),
+ datePickerEnd: new Date(`${moment(new Date()).format('YYYY-MM-DD')} 23:59`)
+ });
this.getEarlyWarningList()
}
diff --git a/src/app/system-management/analysis-of-the-host/analysis-of-the-host.component.ts b/src/app/system-management/analysis-of-the-host/analysis-of-the-host.component.ts
index 724ab45..e9921ac 100644
--- a/src/app/system-management/analysis-of-the-host/analysis-of-the-host.component.ts
+++ b/src/app/system-management/analysis-of-the-host/analysis-of-the-host.component.ts
@@ -26,12 +26,7 @@ export class AnalysisOfTheHostComponent implements OnInit {
nzExpandAll = false;
totalCount: string
getAllOrganization() {
- this.http.get('/api/services/app/Organization/GetAll', {
- params: {
- SkipCount: '0',
- MaxResultCount: '9999'
- }
- }).subscribe((data: any) => {
+ this.http.get('/api/services/app/Organization/GetAll').subscribe((data: any) => {
this.totalCount = data.result.totalCount
data.result.items.forEach(element => {
element.key = element.id
diff --git a/src/app/system-management/organization/organization.component.ts b/src/app/system-management/organization/organization.component.ts
index e071506..65ba6a8 100644
--- a/src/app/system-management/organization/organization.component.ts
+++ b/src/app/system-management/organization/organization.component.ts
@@ -36,12 +36,7 @@ export class OrganizationComponent implements OnInit {
nzExpandAll = false;
totalCount: string
getAllOrganization() {
- this.http.get('/api/services/app/Organization/GetAll',{
- params:{
- SkipCount:'0',
- MaxResultCount:'9999'
- }
- }).subscribe((data: any) => {
+ this.http.get('/api/services/app/Organization/GetAll').subscribe((data: any) => {
this.totalCount = data.result.totalCount
// console.log('组织机构',data.result.totalCount)
data.result.items.forEach(element => {
diff --git a/src/assets/images/level4.png b/src/assets/images/level4.png
new file mode 100644
index 0000000..451f69a
Binary files /dev/null and b/src/assets/images/level4.png differ
diff --git a/src/theme.less b/src/theme.less
index 47aab87..7f7917c 100644
--- a/src/theme.less
+++ b/src/theme.less
@@ -177,7 +177,7 @@
#recordsbox,
#warningbox,
#warningboxadmin,
-#addequipment {
+#addequipment,#stationPlanBox {
::-webkit-input-placeholder {
/* WebKit browsers */
color: #345d85;
@@ -278,7 +278,7 @@
#stationPlanBox {
-
+
.ant-tree .ant-tree-node-content-wrapper:hover,
.ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected {
background: linear-gradient(90deg, rgba(0, 13, 33, 0) 0%, #2399FF 50%, rgba(0, 13, 33, 0) 100%);
@@ -342,11 +342,22 @@
padding: 0;
color: #91CCFF;
}
-
.look {
color: #36A2FF;
cursor: pointer;
}
+ .ant-table-measure-now{
+ display: none;
+ }
+ .ant-empty-description{
+ color: #23D9FF;
+ }
+ .ant-table-tbody > tr > td{
+ border-bottom: none;
+ }
+ .ant-table-tbody > tr > td:hover{
+ background: none;
+ }
}