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 5635a5a..2b72f1f 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
@@ -15,7 +15,7 @@ import { NavChangeService } from '../../service/navChange.service';
import 'linqjs';
import { DispositionComponent } from '../disposition/disposition.component';
import { NzMessageService } from 'ng-zorro-antd/message';
-
+import { listRefreshService } from '../../service/listRefresh.service';
@Component({
selector: 'app-today-warning-admin',
templateUrl: './today-warning-admin.component.html',
@@ -24,8 +24,8 @@ import { NzMessageService } from 'ng-zorro-antd/message';
export class TodayWarningAdminComponent implements OnInit {
validateForm!: FormGroup;
- constructor(private http: HttpClient, private fb: FormBuilder, private router: Router, private toTree: TreeService, private modal: NzModalService, private viewContainerRef: ViewContainerRef, private navChangeService: NavChangeService, private message: NzMessageService) { }
- isSpin:boolean = false
+ constructor(private listRefreshService: listRefreshService, private http: HttpClient, private fb: FormBuilder, private router: Router, private toTree: TreeService, private modal: NzModalService, private viewContainerRef: ViewContainerRef, private navChangeService: NavChangeService, private message: NzMessageService) { }
+ isSpin: boolean = false
ngOnInit(): void {
this.validateForm = this.fb.group({
level: [null],
@@ -40,11 +40,25 @@ export class TodayWarningAdminComponent implements OnInit {
this.warningType()
this.isSpin = true
this.getAllOrganization()
+
+ this.listRefreshService.getMessage().subscribe((message: any) => {
+ // console.log('需要更新列表了', message);//send a message
+ this.getEarlyWarningList()
+ // let params = {
+ // id: message.notification.entityId
+ // }
+ // this.http.get('/api/services/app/ViolateRecord/Get', {
+ // params: params
+ // }).subscribe((data: any) => {
+ // this.list.unshift(data.result)
+ // console.log('新获取一条', data.result)
+ // })
+ });
}
//预警类型接口
warningTypes: any //预警接口数据
- warningTypesDetailsMetadata:any
+ warningTypesDetailsMetadata: any
warningTypesDetails: any
warningType() {
this.http.get('/api/services/app/Violation/GetAllList').subscribe((data: any) => {
@@ -55,7 +69,7 @@ export class TodayWarningAdminComponent implements OnInit {
}
typeChange(e) {
// console.log(e)
- if(!e){
+ if (!e) {
this.warningTypesDetails = this.warningTypesDetailsMetadata
}
this.warningTypes.forEach(element => {
@@ -196,7 +210,7 @@ export class TodayWarningAdminComponent implements OnInit {
},
nzFooter: null,
nzOnOk: async () => {
- console.log(99999,instance.content)
+ console.log(99999, instance.content)
}
});
const instance = modal.getContentComponent();
diff --git a/src/app/pages/today-warning/today-warning.component.ts b/src/app/pages/today-warning/today-warning.component.ts
index 5f4e570..c5b086e 100644
--- a/src/app/pages/today-warning/today-warning.component.ts
+++ b/src/app/pages/today-warning/today-warning.component.ts
@@ -10,6 +10,7 @@ import { NavChangeService } from '../../service/navChange.service';
import * as moment from 'moment';
import { DispositionComponent } from '../disposition/disposition.component';
import { NzMessageService } from 'ng-zorro-antd/message';
+import { listRefreshService } from '../../service/listRefresh.service';
@Component({
selector: 'app-today-warning',
templateUrl: './today-warning.component.html',
@@ -17,7 +18,7 @@ import { NzMessageService } from 'ng-zorro-antd/message';
})
export class TodayWarningComponent implements OnInit {
validateForm!: FormGroup;
- constructor(private http: HttpClient, private fb: FormBuilder, private toTree: TreeService, private modal: NzModalService, private viewContainerRef: ViewContainerRef, private navChangeService: NavChangeService, private message: NzMessageService) { }
+ constructor(private listRefreshService: listRefreshService, private http: HttpClient, private fb: FormBuilder, private toTree: TreeService, private modal: NzModalService, private viewContainerRef: ViewContainerRef, private navChangeService: NavChangeService, private message: NzMessageService) { }
ngOnInit(): void {
this.validateForm = this.fb.group({
@@ -30,6 +31,19 @@ export class TodayWarningComponent implements OnInit {
});
this.warningType()
this.getEarlyWarningList()
+ this.listRefreshService.getMessage().subscribe((message: any) => {
+ // console.log('需要更新列表了', message);//send a message
+ this.getEarlyWarningList()
+ // let params = {
+ // id: message.notification.entityId
+ // }
+ // this.http.get('/api/services/app/ViolateRecord/Get', {
+ // params: params
+ // }).subscribe((data: any) => {
+ // this.list.unshift(data.result)
+ // console.log('新获取一条', data.result)
+ // })
+ });
}
//预警类型接口
@@ -54,7 +68,7 @@ export class TodayWarningComponent implements OnInit {
list: any = [
]
totalCount: string //预警总数
- isSpin:boolean = false
+ isSpin: boolean = false
getEarlyWarningList() {
let ViolationIds = []
if (this.validateForm.value.type) {
diff --git a/src/app/pages/warning-statistics-list/warning-statistics-list.component.html b/src/app/pages/warning-statistics-list/warning-statistics-list.component.html
new file mode 100644
index 0000000..9463535
--- /dev/null
+++ b/src/app/pages/warning-statistics-list/warning-statistics-list.component.html
@@ -0,0 +1,185 @@
+
+
+
+
+
+
+
+ 预警类型统计
+ 卸油统计
+ 证照预警统计
+
+
+
+
+
+
+
+
+
+
+ 
+ 证照预警统计
+
+
+
返回
+
+
+
+
+
+
+
+
+ 近30天证照预警走势
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 油站名称
+
+
+ 公司名称
+
+
+ 区域
+
+
+ 卸油开始时间
+
+
+ 卸油结束时间
+
+
+ 操作前准备预警节点数量
+
+
+ 操作中准备预警节点数量
+
+
+ 全流程准备预警节点数量
+
+
+ 状态
+
+
+ 操作
+
+
+
+
+
+
+ {{item.gasStation.stationName}}
+
+
+ {{item.gasStation.companyName}}
+
+
+ {{item.gasStation.locationName}}
+
+
+ {{item.startTime ? (item.startTime | date:"yyyy-MM-dd HH:mm:ss") : '/'}}
+
+
+ {{item.endTime ? (item.endTime | date:"yyyy-MM-dd HH:mm:ss") : '/'}}
+
+
+ {{item.proccessBeforeCount}}
+
+
+ {{item.proccessingCount}}
+
+
+ {{item.allProccessCount}}
+
+
+
+ 合规
+
+
+ 预警
+
+
+
+ 查看
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/app/pages/warning-statistics-list/warning-statistics-list.component.scss b/src/app/pages/warning-statistics-list/warning-statistics-list.component.scss
new file mode 100644
index 0000000..833bcf1
--- /dev/null
+++ b/src/app/pages/warning-statistics-list/warning-statistics-list.component.scss
@@ -0,0 +1,615 @@
+.recordsbox {
+ width: 100%;
+ height: 100%;
+ display: flex;
+ flex-direction: column;
+}
+
+.search {
+ box-sizing: border-box;
+ padding: 0 36px;
+ width: 100%;
+ height: 32px;
+ margin-bottom: 16px;
+
+ form {
+ width: 100%;
+ height: 32px;
+ display: flex;
+ justify-content: flex-start;
+
+ .searchParams,
+ .btn {
+ margin: 0 3px;
+ }
+
+ .searchParams {
+ // flex: 10;
+ width: 150px;
+
+ }
+
+ .searchParamsLong {
+ width: 250px;
+ }
+
+ .searchParams2 {
+ width: 220px;
+ }
+
+ .btn {
+ // flex: 1;
+ }
+
+ nz-select {
+ color: rgba(145, 204, 255, 0.95);
+ }
+
+ nz-tree-select {
+ color: rgba(145, 204, 255, 0.95);
+ }
+
+ nz-range-picker {
+ background-color: rgba(0, 0, 0, 0);
+ width: 100%;
+ }
+
+ }
+
+
+}
+
+.content {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+ overflow: hidden;
+
+ .title {
+ margin: 13px 0;
+ width: 100%;
+ height: 64px;
+ box-sizing: border-box;
+ padding: 0 28px;
+ position: relative;
+
+ .titlebox {
+ width: 100%;
+ height: 100%;
+ display: flex;
+ align-items: center;
+
+ img {
+ width: 65px;
+ height: 65px;
+ }
+
+ .content {
+ flex: 1;
+ height: 48px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ // background-image: linear-gradient(to right, #002147, #033565, #064e8e, #064e8e, #033565, #002147);
+ background: linear-gradient(270deg, rgba(35, 153, 255, 0) 0%, rgba(35, 153, 255, 0.32) 50%, rgba(35, 153, 255, 0) 100%);
+
+ .contentitem {
+ width: 100%;
+ height: 32px;
+ display: flex;
+ align-items: center;
+ // background-image: linear-gradient(to right, #002147, #0f5ca0, #1c88e6, #1c88e6, #0f5ca0, #002147);
+ background: linear-gradient(270deg, rgba(35, 153, 255, 0) 0%, rgba(35, 153, 255, 0.8) 50%, rgba(35, 153, 255, 0) 100%);
+
+ span {
+ margin-left: 10px;
+ color: #bce0ff;
+ font-size: 20px;
+ font-family: titlefont;
+ cursor: pointer;
+ }
+
+ span:nth-child(1) {
+ margin-left: 12px;
+ }
+
+ .grey {
+ color: #68829F;
+ }
+ }
+
+ }
+ }
+
+ .packup {
+ position: absolute;
+ right: 33px;
+ top: 16px;
+ cursor: pointer;
+ }
+ }
+
+ .chartsbox {
+ width: 100%;
+ display: flex;
+ justify-content: center;
+
+ .chartname {
+ position: absolute;
+ left: 20px;
+ top: 12px;
+ }
+
+ .chart {
+ width: 97%;
+ height: 350px;
+ box-sizing: border-box;
+ padding: 0 10px;
+ display: flex;
+
+ div {
+ display: flex;
+ flex-direction: column;
+
+ span {
+ font-family: titlefont;
+ display: flex;
+ align-items: center;
+ height: 28px;
+ color: #bee1ff;
+ font-size: 16px;
+ }
+
+ div {
+ flex: 1;
+ }
+ }
+
+ .leftbox {
+ width: 360px;
+ position: relative;
+ border: 0px;
+ box-shadow: 0 0 26px 0px #1a7fd7 inset;
+ margin-right: 16px;
+
+ .centerContent {
+ position: absolute;
+ top: 34%;
+ left: 50%;
+ transform: translateX(-50%);
+ width: 170px;
+
+ div {
+ text-align: center;
+ }
+
+ .numname {
+ // font-family: titlefont;
+ color: #bee1ff;
+ }
+
+ .num {
+ color: #FFFFFF;
+ font-size: 38px;
+ text-shadow: 0px 0px 16px #3A9AFF;
+ font-weight: bold;
+ height: 46px;
+ line-height: 46px;
+ }
+ }
+
+ .goback {
+ position: absolute;
+ right: 20px;
+ top: 14px;
+ color: #C4E2FC;
+ font-family: synormal;
+ font-size: 14px;
+ z-index: 999;
+ cursor: pointer;
+ }
+ }
+
+ .rightbox {
+ flex: 1;
+ position: relative;
+ border: 0px;
+ box-shadow: 0 0 26px 0px #1a7fd7 inset;
+
+ .btnbox {
+ position: absolute;
+ right: 28px;
+ top: 12px;
+ display: flex;
+ flex-direction: row;
+ z-index: 999;
+
+ button {
+ border: 1px solid #91CCFF;
+ color: #91CCFF;
+ border-radius: 0px;
+ box-shadow: 0 0 5px 0 #2399FF inset;
+ background: none;
+ }
+
+ .rankingBtn {
+ margin-right: 16px;
+ }
+
+ .selectedbtn {
+ background: linear-gradient(180deg, #000D21 0%, #001331 27%, #2399FF 100%);
+ color: white;
+ }
+ }
+ }
+ }
+ }
+
+ .tablebox {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ overflow: hidden;
+
+ .table {
+ color: white;
+ flex: 1;
+ width: 96%;
+ display: flex;
+ flex-direction: column;
+ overflow: hidden;
+
+ .th {
+ height: 38px;
+ line-height: 38px;
+ background: rgba(35, 153, 255, 0.2);
+ border: 1px solid rgba(35, 217, 255, 0.4);
+ box-shadow: 0 0 3px 0 rgba(35, 217, 255, 0.4) inset;
+ color: #23D9FF;
+ }
+
+ .tbody {
+ flex: 1;
+ overflow-y: auto;
+
+ .tr {
+ height: 38px;
+ line-height: 38px;
+ border-bottom: 1px solid #0d3761;
+
+ div {
+
+ color: #91CCFF;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+
+ .look {
+ color: #36A2FF;
+ cursor: pointer;
+ }
+ }
+ }
+ }
+ }
+
+ .pagination {
+ margin: 15px 0;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+
+ ::-webkit-scrollbar {
+ width: 0px;
+ }
+
+ }
+}
+
+
+// 适配125%
+@media screen and (max-height: 750px) {
+ .search {
+ box-sizing: border-box;
+ padding: 0 30px;
+ height: 32px;
+ margin-bottom: 12px;
+
+ form {
+ width: 100%;
+ height: 32px;
+ }
+ }
+
+ .content {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+ overflow: hidden;
+
+ .title {
+ height: 42px;
+ padding: 0 20px;
+ margin: 8px 0;
+
+ .titlebox {
+ width: 100%;
+ height: 100%;
+ display: flex;
+ align-items: center;
+
+ img {
+ width: 46px;
+ height: 46px;
+ }
+
+ .content {
+ height: 36px;
+
+ .contentitem {
+ width: 100%;
+ height: 25px;
+
+ span {
+ margin-left: 6px;
+ font-size: 16px;
+ }
+
+ span:nth-child(1) {
+ margin-left: 8px;
+ }
+ }
+
+ }
+ }
+
+ .packup {
+ position: absolute;
+ right: 33px;
+ top: 4px;
+ cursor: pointer;
+ }
+ }
+
+ .chartsbox {
+ width: 100%;
+ height: 43%;
+
+ .chartname {
+ position: absolute;
+ left: 20px;
+ top: 12px;
+ }
+
+ .chart {
+ width: 97%;
+ height: 100%;
+
+ div {
+ span {
+ font-size: 14px;
+ }
+
+ div {
+ flex: 1;
+ }
+
+ }
+
+ .leftbox {
+ width: 300px;
+ box-shadow: 0 0 20px 0px #1a7fd7 inset;
+ margin-right: 12px;
+
+ .centerContent {
+ .num {
+ color: #FFFFFF;
+ font-size: 42px;
+ text-shadow: 0px 0px 16px #3A9AFF;
+ font-weight: bold;
+ height: 49px;
+ line-height: 50px;
+ }
+ }
+ }
+
+ .rightbox {
+ flex: 1;
+ position: relative;
+ border: 0px;
+ box-shadow: 0 0 26px 0px #1a7fd7 inset;
+
+ .btnbox {
+ position: absolute;
+ right: 28px;
+ top: 12px;
+ display: flex;
+ flex-direction: row;
+ z-index: 999;
+
+ .rankingBtn {
+ margin-right: 12px;
+ }
+ }
+ }
+ }
+ }
+
+ .tablebox {
+ .table {
+ .th {
+ height: 32px;
+ line-height: 32px;
+ font-size: 12px !important;
+ }
+
+ .tbody {
+
+ .tr {
+ height: 32px;
+ line-height: 32px;
+
+ div {
+ font-size: 12px !important;
+ }
+
+ img {
+ width: 32px;
+ }
+ }
+ }
+ }
+ }
+ }
+}
+
+// 适配150%
+@media screen and (max-height: 600px) {
+ .search {
+ box-sizing: border-box;
+ padding: 0 22px;
+ height: 32px;
+ margin-bottom: 6px;
+
+ form {
+ width: 100%;
+ height: 32px;
+ }
+ }
+
+ .content {
+ .title {
+ height: 36px;
+ padding: 0 20px;
+ margin: 3px 0;
+
+ .titlebox {
+ width: 100%;
+ height: 100%;
+ display: flex;
+ align-items: center;
+
+ img {
+ width: 36px;
+ height: 36px;
+ }
+
+ .content {
+ height: 30px;
+
+ .contentitem {
+ width: 100%;
+ height: 22px;
+
+ span {
+ margin-left: 6px;
+ font-size: 13px;
+ }
+
+ span:nth-child(1) {
+ margin-left: 12px;
+ }
+ }
+
+ }
+ }
+
+ .packup {
+ position: absolute;
+ right: 33px;
+ top: 2px;
+ cursor: pointer;
+ }
+ }
+
+ .chartsbox {
+ width: 100%;
+ height: 40%;
+
+ .chartname {
+ position: absolute;
+ left: 20px;
+ top: 12px;
+ }
+
+ .chart {
+ width: 97%;
+ height: 100%;
+
+ div {
+ span {
+ font-size: 14px;
+ }
+
+ div {
+ flex: 1;
+ }
+
+ }
+
+ .leftbox {
+ width: 260px;
+ box-shadow: 0 0 20px 0px #1a7fd7 inset;
+ margin-right: 8px;
+
+ .centerContent {
+ .num {
+ color: #FFFFFF;
+ font-size: 32px;
+ text-shadow: 0px 0px 12px #3A9AFF;
+ font-weight: bold;
+ height: 42px;
+ line-height: 42px;
+ }
+ }
+ }
+
+ .rightbox {
+ box-shadow: 0 0 22px 0px #1a7fd7 inset;
+
+ .btnbox {
+ position: absolute;
+ right: 28px;
+ top: 12px;
+ display: flex;
+ flex-direction: row;
+ z-index: 999;
+
+ .rankingBtn {
+ margin-right: 8px;
+ }
+ }
+ }
+ }
+ }
+
+ .tablebox {
+ .table {
+ .th {
+ height: 28px;
+ line-height: 28px;
+ font-size: 10px !important;
+ }
+
+ .tbody {
+
+ .tr {
+ height: 28px;
+ line-height: 28px;
+
+ div {
+ font-size: 10px !important;
+ }
+
+ img {
+ width: 30px;
+ }
+ }
+ }
+ }
+
+ }
+ }
+}
diff --git a/src/app/pages/warning-statistics-list/warning-statistics-list.component.ts b/src/app/pages/warning-statistics-list/warning-statistics-list.component.ts
new file mode 100644
index 0000000..289d99b
--- /dev/null
+++ b/src/app/pages/warning-statistics-list/warning-statistics-list.component.ts
@@ -0,0 +1,704 @@
+import { HttpClient } from '@angular/common/http';
+import { Component, OnInit, ViewContainerRef, ElementRef } from '@angular/core';
+import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import * as echarts from 'echarts';
+import { NzModalService } from 'ng-zorro-antd/modal';
+import { GetOutOfLineDetailsComponent } from '../today-warning/get-out-of-line-details/get-out-of-line-details.component';
+import * as moment from 'moment';
+import { fromEvent } from 'rxjs';
+import { debounceTime } from 'rxjs/operators';
+import { Router } from '@angular/router';
+import { OilUnloadingProcessComponent } from '../oil-unloading-process/oil-unloading-process.component';
+import { TreeService } from 'src/app/service/tree.service';
+
+@Component({
+ selector: 'app-warning-statistics-list',
+ templateUrl: './warning-statistics-list.component.html',
+ styleUrls: ['./warning-statistics-list.component.scss']
+})
+export class WarningStatisticsListComponent implements OnInit {
+
+ validateForm!: FormGroup;
+ constructor(private toTree: TreeService, private http: HttpClient, private fb: FormBuilder, private router: Router, private modal: NzModalService, private viewContainerRef: ViewContainerRef, private element: ElementRef) { }
+
+ myChart: any //左侧饼图
+ mybarChart: any //柱状图
+
+
+ getThirtyDays() {
+ //获取当前日期
+ let myDate = new Date();
+ var nowY = myDate.getFullYear();
+ var nowM = myDate.getMonth() + 1;
+ var nowD = myDate.getDate();
+ var enddateStr = nowY + "-" + (nowM < 10 ? "0" + nowM : nowM) + "-" + (nowD < 10 ? "0" + nowD : nowD);//当前日期
+ var enddate = new Date(enddateStr);
+
+
+ //获取三十天前日期
+ var lw = new Date(new Date().getTime() - 1000 * 60 * 60 * 24 * 30);//最后一个数字30可改，30天的意思
+ var lastY = lw.getFullYear();
+ var lastM = lw.getMonth() + 1;
+ var lastD = lw.getDate();
+ var startdateStr = lastY + "-" + (lastM < 10 ? "0" + lastM : lastM) + "-" + (lastD < 10 ? "0" + lastD : lastD);//三十天之前日期
+ var startDate = new Date(startdateStr);
+
+ const dateList = []
+ while (true) {
+ startDate.setDate(startDate.getDate() + 1)
+ if (startDate.getTime() <= enddate.getTime()) {
+ if (startDate.getDate() < 10) {
+ // startDate.getFullYear() 获取年，此处没加上年份
+ dateList.push((startDate.getMonth() + 1) + '.0' + startDate.getDate())
+ } else {
+ dateList.push((startDate.getMonth() + 1) + '.' + startDate.getDate())
+ }
+ } else {
+ break
+ }
+ }
+ return dateList;
+ }
+
+ isEcharts: boolean = true
+ isEchartsShow() {
+ this.isEcharts = !this.isEcharts
+ }
+ startdate
+ enddate
+
+ isOrShow: boolean
+ ngOnInit(): void {
+ //当前日期
+ let myDate: any = new Date();
+ let nowY = myDate.getFullYear();
+ let nowM = myDate.getMonth() + 1;
+ let nowD = myDate.getDate();
+ this.enddate = nowY + "-" + (nowM < 10 ? "0" + nowM : nowM) + "-" + (nowD < 10 ? "0" + nowD : nowD);//当前日期
+ //获取三十天前日期
+ let lw = new Date(myDate - 1000 * 60 * 60 * 24 * 30);//最后一个数字30可改，30天的意思
+ let lastY = lw.getFullYear();
+ let lastM = lw.getMonth() + 1;
+ let lastD = lw.getDate();
+ this.startdate = lastY + "-" + (lastM < 10 ? "0" + lastM : lastM) + "-" + (lastD < 10 ? "0" + lastD : lastD);//三十天之前日期
+ this.validateForm = this.fb.group({
+ // state: [null],
+ organization: [null],
+ datePicker: [[this.startdate, this.enddate]]
+ });
+ // 饼图
+ this.myChart = echarts.init(document.getElementById('piechart'));
+ //柱状折线图
+ this.mybarChart = echarts.init(document.getElementById('barchart'));
+ this.tableSpin = true
+ this.getAllOrganization()
+ this.getAggregations()
+ if (this.router.url.indexOf('petrolStation') != -1) {
+ this.isOrShow = false
+ } else {
+ this.isOrShow = true
+ }
+ }
+ //刷新饼图图表数据
+ num
+ echartsData: any
+ //一级饼图
+ oilchartpieOption = {
+ color: ['#FF4B65', '#36A2FF'],
+ tooltip: {
+ trigger: 'item'//触发类型
+ },
+ legend: {
+ bottom: '12%',
+ left: 'center',
+ itemGap: 40,
+ itemWidth: 8,
+ itemHeight: 8,
+ formatter: (name) => {
+ let data = this.oilchartpieOptionPieData1
+ let value
+ for (var i = 0, l = data.length; i < l; i++) {
+ if (data[i].name == name) {
+ value = data[i].value;
+ }
+ }
+ return '{a|' + name + '}' + '{b|' + value + '}';
+ },
+ textStyle: {
+ color: '#fff',
+ rich: {
+ a: {
+ width: 80
+ }
+ }
+ }
+ },
+ series: [
+ {
+ type: 'pie',
+ radius: ['50%', '60%'],
+ bottom: '10%',
+ avoidLabelOverlap: false,//防止标签重叠策略
+ label: {//每一个标签外网延伸的引导说明
+ show: false,
+ position: 'outside'
+ },
+ data: [],
+ tooltip: {//鼠标移入提示
+ position: 'right',
+ padding: [14, 19],
+ backgroundColor: 'rgba(28, 129, 218, 0.4)',
+ textStyle: {
+ color: '#fff',
+ fontSize: 12
+ }
+ }
+ }
+ ]
+ };
+ oilchartpieOptionPieData1: any
+ //一级柱状图
+ oilchartbarOption = {
+ xAxis: {
+ type: 'category',
+ data: [],
+ axisLine: {
+ show: false,
+ lineStyle: {
+ color: '#91CCFF'
+ }
+ },
+ axisTick: {//刻度线
+ show: false
+ },
+ inverse: true
+ },
+ yAxis: {
+ type: 'value',
+ nameTextStyle: {
+ color: '#C4E2FC'
+ },
+ splitLine: {//分割线
+ lineStyle: {
+ color: ['#0f4374'],
+ width: 2
+ }
+ },
+ axisTick: {//刻度线
+ show: false
+ },
+ axisLine: {//轴线
+ show: false,
+ lineStyle: {
+ color: '#C4E2FC'
+ }
+ }
+ },
+ tooltip: {
+ // trigger: 'axis'
+ },
+ series: [
+ {
+ name: '证照预警事件',
+ data: [],
+ type: 'bar',
+ itemStyle: {
+ color: {
+ type: 'linear',
+ x: 0,
+ y: 0,
+ x2: 0,
+ y2: 1,
+ colorStops: [{
+ offset: 0, color: '#23F0FF' // 0% 处的颜色
+ }, {
+ offset: 1, color: 'rgba(35, 153, 255, 0.1)' // 100% 处的颜色
+ }],
+ global: false // 缺省为 false
+ }
+ },
+ barWidth: '25%'
+ },
+ {
+ name: '证照预警事件',
+ data: [],
+ type: 'line',
+ symbol: 'circle',
+ symbolSize: 8,
+ label: {
+ show: true
+ },
+ itemStyle: {
+ color: '#fff',
+ shadowColor: '#fff',
+ shadowBlur: 10
+ },
+ lineStyle: {
+ color: '#FFCC8A',
+ width: 1
+ }
+ }
+ ],
+ legend: {
+ data: ['证照预警事件'],
+ textStyle: {
+ color: '#fff'
+ },
+ right: 28,
+ top: 18,
+ itemWidth: 8,
+ itemHeight: 8,
+ },
+ grid: {
+ left: '42px',
+ right: '30px',
+ bottom: '38px',
+ top: '80px'
+ }
+ };
+
+ //二级饼图
+ oilchartpieOption2 = {
+ color: ['#36A2FF', '#FFBD4B', '#46DFFF'],
+ tooltip: {
+ trigger: 'item'//触发类型
+ },
+ legend: {
+ bottom: '8%',
+ left: 'center',
+ itemGap: 10,
+ itemWidth: 8,
+ itemHeight: 8,
+ formatter: (name) => {
+ let data = this.oilchartpieOptionPieData2
+ let value
+ for (var i = 0, l = data.length; i < l; i++) {
+ if (data[i].name == name) {
+ value = data[i].value;
+ }
+ }
+ return '{a|' + name + '}' + '{b|' + value + '}';
+ },
+ textStyle: {
+ color: '#fff',
+ rich: {
+ a: {
+ width: 60
+ }
+ }
+ }
+ },
+ series: [
+ {
+ type: 'pie',
+ radius: ['50%', '60%'],
+ bottom: '10%',
+ avoidLabelOverlap: false,//防止标签重叠策略
+ label: {//每二个标签外网延伸的引导说明
+ show: false,
+ position: 'outside'
+ },
+ data: [],
+ tooltip: {//鼠标移入提示
+ position: 'right',
+ padding: [14, 19],
+ backgroundColor: 'rgba(28, 129, 218, 0.4)',
+ textStyle: {
+ color: '#fff',
+ fontSize: 12
+ }
+ }
+ }
+ ]
+ };
+ oilchartpieOptionPieData2: any
+ //二级柱状图
+ oilchartbarOption2 = {
+ tooltip: {
+ // trigger: 'axis'
+ },
+ xAxis: {
+ type: 'category',
+ data: [],
+ axisLine: {
+ show: false,
+ lineStyle: {
+ color: '#91CCFF'
+ }
+ },
+ axisTick: {//刻度线
+ show: false
+ },
+ inverse: true
+
+ },
+ yAxis: {
+ type: 'value',
+ nameTextStyle: {
+ color: '#C4E2FC'
+ },
+ splitLine: {//分割线
+ lineStyle: {
+ color: ['#0f4374'],
+ width: 2
+ }
+ },
+ axisTick: {//刻度线
+ show: false
+ },
+ axisLine: {//轴线
+ show: false,
+ lineStyle: {
+ color: '#C4E2FC'
+ }
+ }
+ },
+ legend: {
+ data: ['事前准备', '事中操作', '全程监测'],
+ textStyle: {
+ color: '#fff'
+ },
+ right: 18,
+ top: 18,
+ itemWidth: 8,
+ itemHeight: 8,
+ },
+ series: [
+ {
+ name: '',
+ data: [],
+ type: 'bar',
+ itemStyle: {
+ color: {
+ type: 'linear',
+ x: 0,
+ y: 0,
+ x2: 0,
+ y2: 1,
+ colorStops: [{
+ offset: 0, color: 'rgba(54, 162, 255, 1)' // 0% 处的颜色
+ }, {
+ offset: 1, color: 'rgba(54, 162, 255, 0.1)' // 100% 处的颜色
+ }],
+ global: false // 缺省为 false
+ }
+ },
+ barWidth: '25%'
+ },
+ {
+ name: '',
+ data: [],
+ type: 'bar',
+ itemStyle: {
+ color: {
+ type: 'linear',
+ x: 0,
+ y: 0,
+ x2: 0,
+ y2: 1,
+ colorStops: [{
+ offset: 0, color: 'rgba(255, 189, 75, 1)' // 0% 处的颜色
+ }, {
+ offset: 1, color: 'rgba(255, 189, 75, 0.1)' // 100% 处的颜色
+ }],
+ global: false // 缺省为 false
+ }
+ },
+ barWidth: '25%'
+ },
+ {
+ name: '',
+ data: [],
+ type: 'bar',
+ itemStyle: {
+ color: {
+ type: 'linear',
+ x: 0,
+ y: 0,
+ x2: 0,
+ y2: 1,
+ colorStops: [{
+ offset: 0, color: 'rgba(70, 223, 255, 1)' // 0% 处的颜色
+ }, {
+ offset: 1, color: 'rgba(70, 223, 255, 0.1)' // 100% 处的颜色
+ }],
+ global: false // 缺省为 false
+ }
+ },
+ barWidth: '25%'
+ }
+ ],
+ grid: {
+ left: '42px',
+ right: '30px',
+ bottom: '38px',
+ top: '80px'
+ }
+ };
+ isgoback: boolean = false
+ refreshEchartsData1(data) {
+ this.num = data.totalCount
+ //饼图
+ this.oilchartpieOptionPieData1 = [
+ { name: '消防器材预警', value: data.notCorrectCount },
+ { name: '证照预警', value: data.correctCount },
+ ]
+ this.oilchartpieOption.series[0].data = this.oilchartpieOptionPieData1
+ this.myChart.setOption(this.oilchartpieOption);
+ this.myChart.off('legendselectchanged')
+ this.myChart.off('click')
+ this.myChart.on('legendselectchanged', (params) => {
+ this.myChart.setOption({
+ legend: { selected: { [params.name]: true } }
+ })
+ if (params.name == '预警事件') {
+ this.isgoback = true
+ this.refreshEchartsData2(this.echartsData)
+ this.validateForm.patchValue({
+ state: '0'
+ });
+ this.list = []
+ this.SkipCount = '0'
+ this.getViolateRecordList()
+ }
+ });
+ this.myChart.on('click', (params) => {
+ if (params.name == '预警事件') {
+ this.isgoback = true
+ this.refreshEchartsData2(this.echartsData)
+ this.validateForm.patchValue({
+ state: '0'
+ });
+ this.list = []
+ this.SkipCount = '0'
+ this.getViolateRecordList()
+ }
+ });
+
+ //柱状图
+ let monthArr = []
+ let valuedata = []
+ data.list.forEach(element => {
+ monthArr.push(moment(element.key).format('MM.DD'))
+ valuedata.push(element.totalCount)
+ });
+ this.oilchartbarOption.xAxis.data = monthArr
+ this.oilchartbarOption.series[0].data = valuedata
+ this.oilchartbarOption.series[1].data = valuedata
+ this.mybarChart.setOption(this.oilchartbarOption);
+ }
+ refreshEchartsData2(data) {
+ this.num = Number(data.proccessBeforeCount + data.proccessingCount + data.allProccessCount)
+ //饼图
+ this.oilchartpieOptionPieData2 = [
+ { name: '事前准备', value: data.proccessBeforeCount },
+ { name: '事中操作', value: data.proccessingCount },
+ { name: '全程检测', value: data.allProccessCount }
+ ]
+ this.oilchartpieOption2.series[0].data = this.oilchartpieOptionPieData2
+ this.myChart.setOption(this.oilchartpieOption2);
+
+ //柱状图
+ let monthArr = []
+ let valuedataBefore = []
+ let valuedataIng = []
+ let valuedataAll = []
+ data.list.forEach(element => {
+ monthArr.push(moment(element.key).format('MM.DD'))
+ valuedataBefore.push(element.proccessBeforeCount)
+ valuedataIng.push(element.proccessingCount)
+ valuedataAll.push(element.allProccessCount)
+ });
+ this.oilchartbarOption2.xAxis.data = monthArr
+ this.oilchartbarOption2.series[0].name = '事前准备'
+ this.oilchartbarOption2.series[0].data = valuedataBefore
+ this.oilchartbarOption2.series[1].name = '事中操作'
+ this.oilchartbarOption2.series[1].data = valuedataIng
+ this.oilchartbarOption2.series[2].name = '全程监测'
+ this.oilchartbarOption2.series[2].data = valuedataAll
+ this.mybarChart.setOption(this.oilchartbarOption2);
+ }
+ goback() {
+ this.isgoback = false
+ this.myChart.clear();
+ this.mybarChart.clear();
+ this.refreshEchartsData1(this.echartsData)
+ this.validateForm.patchValue({
+ state: null
+ });
+ this.list = []
+ this.SkipCount = '0'
+ this.getViolateRecordList()
+ }
+
+
+
+ defaultOrId: string
+ //获取所有组织机构
+ nodes: 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: "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
+ });
+ this.nodes = [...this.toTree.toTree(data.result.items)]
+ this.defaultOrId = JSON.parse(sessionStorage.getItem('userdata')).organization.id
+ this.validateForm.value.organization = JSON.parse(sessionStorage.getItem('userdata')).organization.id
+ this.validateForm.patchValue({
+ datePicker: [this.startdate, this.enddate]
+ });
+ this.list = []
+ this.SkipCount = '0'
+ this.getViolateRecordList()
+ })
+ }
+ //获取统计信息
+ chartsSpin: boolean = false
+ getAggregations() {
+ this.chartsSpin = true
+ let organizationUnitId
+ if (this.router.url.indexOf('petrolStation') != -1) {
+ organizationUnitId = JSON.parse(sessionStorage.getItem('userdataOfgasstation')).organization.id
+ } else {
+ organizationUnitId = JSON.parse(sessionStorage.getItem('userdata')).organization.id
+ }
+ let params: any = {
+ OrganizationUnitId: organizationUnitId,
+ IsContainsChildren: 'true'
+ }
+ this.http.get('/api/services/app/OilUnloadingProcess/GetAllCountByDays', { params: params }).subscribe((data: any) => {
+ console.log('统计信息', data)
+ this.chartsSpin = false
+ this.echartsData = data.result
+ this.refreshEchartsData1(this.echartsData)
+ // this.refreshBarLineData(this.echartsData)
+ })
+ }
+
+ //获得卸油记录列表
+ SkipCount: string = '0'
+ MaxResultCount: string = '50'
+ list: any = []
+ totalCount: string
+ tableSpin: boolean = false
+ getViolateRecordList() {
+ this.tableSpin = true
+ let organizationUnitId
+ if (this.router.url.indexOf('petrolStation') != -1) {
+ organizationUnitId = JSON.parse(sessionStorage.getItem('userdataOfgasstation')).organization.id
+ } else {
+ organizationUnitId = this.validateForm.value.organization
+ }
+ let IsCorrect = null
+ if (this.validateForm.value.state) {
+ this.validateForm.value.state == '0' ? IsCorrect = 'false' : IsCorrect = 'true'
+ }
+ let params = {
+ IsCorrect: IsCorrect,
+ StartTime: moment(this.validateForm.value.datePicker[0]).format('yyyy-MM-DD'),
+ EndTime: moment(this.validateForm.value.datePicker[1]).format('yyyy-MM-DD'),
+ IsContainsChildren: 'true',
+ OrganizationUnitId: organizationUnitId,
+ SkipCount: this.SkipCount,
+ MaxResultCount: this.MaxResultCount
+ }
+ this.http.get('/api/services/app/OilUnloadingProcess/GetAll', {
+ params: params
+ }).subscribe((data: any) => {
+ this.tableSpin = false
+ this.list = this.list.concat(data.result.items);
+ this.list = [...this.list]
+ this.totalCount = data.result.totalCount
+ console.log('获取卸油流程列表', data.result.items)
+ })
+ }
+ submitForm(): void {
+ for (const i in this.validateForm.controls) {
+ this.validateForm.controls[i].markAsDirty();
+ this.validateForm.controls[i].updateValueAndValidity();
+ }
+
+ this.list = []
+ this.SkipCount = '0'
+ this.getViolateRecordList()
+ }
+ resetForm(e: MouseEvent): void {
+ e.preventDefault();
+ this.validateForm.reset();
+ for (const key in this.validateForm.controls) {
+ this.validateForm.controls[key].markAsPristine();
+ this.validateForm.controls[key].updateValueAndValidity();
+ }
+ console.log(JSON.parse(sessionStorage.getItem('userdata')).organization.id)
+ // this.validateForm.value.organization = JSON.parse(sessionStorage.getItem('userdata')).organization.id
+ this.validateForm.patchValue({
+ organization: JSON.parse(sessionStorage.getItem('userdata')).organization.id,
+ datePicker: [this.startdate, this.enddate]
+ });
+ this.list = []
+ this.SkipCount = '0'
+ this.getViolateRecordList()
+ }
+ 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) {
+ if (this.totalCount > this.list.length) {
+ console.log('需要加载数据了', event)
+ this.SkipCount = String(Number(this.SkipCount) + 50)
+ this.getViolateRecordList()
+ }
+
+ }
+ });
+ }
+ look(item) {
+ const modal = this.modal.create({
+ nzContent: OilUnloadingProcessComponent,
+ nzViewContainerRef: this.viewContainerRef,
+ nzWidth: 1000,
+ nzBodyStyle: {
+ 'border': '1px solid #6d9cc7',
+ 'border-radius': '0px',
+ 'padding': '0px',
+ 'box-shadow': '0 0 8px 0 #fff',
+ 'background': '#000D21',
+ },
+ nzComponentParams: {
+ data: item
+ },
+ nzFooter: null,
+ nzOnOk: async () => {
+
+ }
+ });
+ const instance = modal.getContentComponent();
+
+ }
+ goOilList() {
+ if (this.router.url.indexOf('petrolStation') != -1) {
+ this.router.navigate(['/records/petrolStation/oliunloadinglist'])
+ } else {
+ this.router.navigate(['/records/oliunloadinglist'])
+ }
+
+ }
+ gorecordList() {
+ if (this.router.url.indexOf('petrolStation') != -1) {
+ this.router.navigate(['/records/petrolStation'])
+ } else {
+ this.router.navigate(['/records'])
+ }
+ }
+
+}
diff --git a/src/app/service/listRefresh.service.ts b/src/app/service/listRefresh.service.ts
new file mode 100644
index 0000000..62f2c46
--- /dev/null
+++ b/src/app/service/listRefresh.service.ts
@@ -0,0 +1,22 @@
+import { Injectable } from '@angular/core';
+import { Observable, ReplaySubject } from 'rxjs';
+
+@Injectable({
+ providedIn: 'root'
+})
+export class listRefreshService {
+
+ constructor() { }
+ private _sendMessage: ReplaySubject
= new ReplaySubject(1);
+ /** * 向其他组件发送信息 **
+ * @param message 需要发送的信息 *
+ * @returns {Observavle} */
+
+ public sendMessage(message: any) {
+ this._sendMessage.next(message);
+ }
+
+ public getMessage(): Observable {
+ return this._sendMessage.asObservable();
+ }
+}
diff --git a/src/assets/images/cameraNum.png b/src/assets/images/cameraNum.png
index de5883c..7a0531f 100644
Binary files a/src/assets/images/cameraNum.png and b/src/assets/images/cameraNum.png differ
diff --git a/src/assets/images/fireNum.png b/src/assets/images/fireNum.png
new file mode 100644
index 0000000..c609219
Binary files /dev/null and b/src/assets/images/fireNum.png differ
diff --git a/src/assets/images/licenseNum.png b/src/assets/images/licenseNum.png
new file mode 100644
index 0000000..1e1a135
Binary files /dev/null and b/src/assets/images/licenseNum.png differ
diff --git a/src/assets/images/modelNum.png b/src/assets/images/modelNum.png
index bc7f014..bc3ef09 100644
Binary files a/src/assets/images/modelNum.png and b/src/assets/images/modelNum.png differ
diff --git a/src/assets/images/stationNum.png b/src/assets/images/stationNum.png
index a20a680..d8c2c34 100644
Binary files a/src/assets/images/stationNum.png and b/src/assets/images/stationNum.png differ
+ 
+ 
diff --git a/src/app/pages/pages-routing.module.ts b/src/app/pages/pages-routing.module.ts
index 952c157..903c72f 100644
--- a/src/app/pages/pages-routing.module.ts
+++ b/src/app/pages/pages-routing.module.ts
@@ -3,7 +3,7 @@ import { NgModule } from '@angular/core';
import { PlanComponent } from './plan/plan.component';
import { TodayWarningComponent } from './today-warning/today-warning.component';
import { CriminalRecordsComponent } from './criminal-records/criminal-records.component';
-import {AuthGuard} from '../auth.guard'
+import { AuthGuard } from '../auth.guard'
import { TodayWarningAdminComponent } from './today-warning-admin/today-warning-admin.component';
import { CriminalRecordsAdminComponent } from './criminal-records-admin/criminal-records-admin.component';
import { OilStationInfoComponent } from './oil-station-info/oil-station-info.component';
@@ -12,17 +12,20 @@ import { PlanAdminComponent } from './plan-admin/plan-admin.component';
import { HomePageComponent } from './home-page/home-page.component';
import { OilUnloadingProcessListComponent } from './oil-unloading-process-list/oil-unloading-process-list.component';
import { init3DGuard } from './init3D.guard';
+import { WarningStatisticsListComponent } from './warning-statistics-list/warning-statistics-list.component';
const routes: Routes = [
{ path: 'homepage', component: HomePageComponent },
{ path: 'plan', component: PlanAdminComponent },
{ path: 'plan/petrolStation', component: PlanComponent, canActivate: [init3DGuard], },
- { path: 'warning', component: TodayWarningAdminComponent },
- { path: 'warning/petrolStation', component: TodayWarningComponent },
+ { path: 'todaywarning', component: TodayWarningAdminComponent },
+ { path: 'todaywarning/petrolStation', component: TodayWarningComponent },
{ path: 'records', component: CriminalRecordsAdminComponent },
{ path: 'records/petrolStation', component: CriminalRecordsComponent },
{ path: 'records/oliunloadinglist', component: OilUnloadingProcessListComponent },
{ path: 'records/petrolStation/oliunloadinglist', component: OilUnloadingProcessListComponent },
+ { path: 'records/warningstatisticslist', component: WarningStatisticsListComponent },
+ { path: 'records/petrolStation/warningstatisticslist', component: WarningStatisticsListComponent },
{ path: 'equipmentInfo', component: EquipmentInfoComponent },
{ path: 'oliStationInfo', component: OilStationInfoComponent }
];
diff --git a/src/app/pages/pages.module.ts b/src/app/pages/pages.module.ts
index dbf5a42..b6d67f7 100644
--- a/src/app/pages/pages.module.ts
+++ b/src/app/pages/pages.module.ts
@@ -55,11 +55,12 @@ import { HomePageComponent } from './home-page/home-page.component';
import { OilUnloadingProcessListComponent } from './oil-unloading-process-list/oil-unloading-process-list.component';
import { ChangePasswordComponent } from './change-password/change-password.component';
import { FacilitySortPipe } from './facility-sort.pipe';
+import { WarningStatisticsListComponent } from './warning-statistics-list/warning-statistics-list.component';
@NgModule({
declarations: [LoginComponent, RegisterComponent, HomeComponent, PlanComponent, TodayWarningComponent, CriminalRecordsComponent,
TodayWarningAdminComponent, CriminalRecordsAdminComponent, LeftDomainComponent, EquipmentInfoComponent, OilStationInfoComponent,
- AddequipmentComponent, EditequipmentComponent,PlanAdminComponent, GetOutOfLineDetailsComponent, DispositionComponent, OilUnloadingProcessComponent, HomePageComponent, OilUnloadingProcessListComponent, ChangePasswordComponent, FacilitySortPipe],
+ AddequipmentComponent, EditequipmentComponent,PlanAdminComponent, GetOutOfLineDetailsComponent, DispositionComponent, OilUnloadingProcessComponent, HomePageComponent, OilUnloadingProcessListComponent, ChangePasswordComponent, FacilitySortPipe, WarningStatisticsListComponent],
imports: [
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 2ef8a00..638951d 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
@@ -22,15 +22,17 @@