src/app/business/entity/data.ts | ●●●●● patch | view | raw | blame | history | |
src/app/business/enum/types.enum.ts | ●●●●● patch | view | raw | blame | history | |
src/app/routes/devices/basic-info/basic-info.component.ts | ●●●●● patch | view | raw | blame | history | |
src/app/routes/devices/basic-info/device-edit/device-edit.component.ts | ●●●●● patch | view | raw | blame | history | |
src/app/routes/reports/query/query.component.html | ●●●●● patch | view | raw | blame | history | |
src/app/routes/reports/query/query.component.ts | ●●●●● patch | view | raw | blame | history |
src/app/business/entity/data.ts
@@ -1,5 +1,5 @@ import { Column } from '@business/entity/grid'; import { AlarmStyle, TimeUnits, AreaRange } from '@business/enum/types.enum'; import { AlarmStyle, TimeUnits, AreaRange, DeviceDimension } from '@business/enum/types.enum'; export interface AreaNames { @@ -154,6 +154,8 @@ areaRange?: AreaRange; areaRangeId?: number; timeUnits?: TimeUnits; deviceDimension?: DeviceDimension; dimensionValue?: any; } export interface PairData { src/app/business/enum/types.enum.ts
@@ -9,8 +9,17 @@ YEAR= 'YEAR', MONTH= 'MONTH', DAY= 'DAY', HOUR= 'HOUR', MINUTE= 'MINUTE' } export enum AreaRange { PROVINCE= 'PROVINCE', CITY= 'CITY', AREA= 'AREA', MONITORPOINT= 'MONITORPOINT', DEVICE= 'DEVICE' PROVINCE= 'PROVINCE', CITY= 'CITY', AREA= 'AREA', MONITORPOINT= 'MONITORPOINT', DEVICE= 'DEVICE' } export enum ResultCode { SUCCESS= 1, FAIL= 0 } export enum DeviceDimension{ MONITORPOINT= 'MONITORPOINT', // 监控点维度 比较特殊,自带行政区属性 PROFESSION='PROFESSION', NONE='NONE' } src/app/routes/devices/basic-info/basic-info.component.ts
@@ -126,7 +126,7 @@ } addOrModify(d) { const data = {}; if (d != null) { if (d != null) { Object.assign(data, d); } this.modalHelper.static(DeviceEditComponent, { data }).subscribe( src/app/routes/devices/basic-info/device-edit/device-edit.component.ts
@@ -3,7 +3,7 @@ import { VersionService } from '@business/services/http/version.service'; import { MonitorPointService } from '@business/services/http/monitor-point.service'; import { NzModalSubject } from 'ng-zorro-antd'; import { FormBuilder, FormGroup, Validators } from '@angular/forms'; import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms'; import { DeviceService } from '@business/services/http/device.service'; import { Component, OnInit } from '@angular/core'; import { Device} from '@business/entity/data'; @@ -11,7 +11,8 @@ import { PageBean, ResultBean } from '@business/entity/grid'; import { _HttpClient } from '@delon/theme'; import { environment } from '@env/environment'; import { debug } from 'util'; import { ExampleService } from '@business/services/util/example.service'; import { Observable } from 'rxjs/Observable'; @Component({ selector: 'app-device-edit', @@ -30,11 +31,18 @@ private monitorPointService: MonitorPointService, private versionService: VersionService, private operateUserService: OperateUserService, private deviceService:DeviceService, private http:_HttpClient ) { } data: Device; //原始数据记录 originalData: Device = {}; validateForm: FormGroup; ngOnInit() { debugger; if(!!this.data){ Object.assign(this.originalData,this.data); } const data = this.data; this.monitorPointChange(null); this.deviceVersionChange(null); @@ -43,10 +51,9 @@ if (this.data.createTime == null) { this.data.createTime = new Date().getTime(); } debugger; const validates: Device = { name: [data.name, [Validators.required]], mac: [data.mac, [Validators.required]], mac: [data.mac, [Validators.required],[this.macAsyncValidator]], deviceVersionId: [data.deviceVersionId], monitorPointId: [data.monitorPointId], professionId: [data.professionId], @@ -62,6 +69,30 @@ validates ); } macAsyncValidator = (control: FormControl): any => { return Observable.create(observer =>{ // 编辑状态,mac未改变 if(!!this.originalData&&this.originalData.mac === control.value){ observer.next(null); observer.complete(); }else { const exampleService = new ExampleService(); exampleService.or().andEqualTo({name:'mac',value:control.value}); this.deviceService.countByExample(exampleService).subscribe( res => { debugger; if(!!res.code&&!!res.data){ observer.next({ error: true, duplicated: true }); }else{ observer.next(null); } observer.complete(); } ); } }); }; close() { this.subject.destroy(); } @@ -79,7 +110,6 @@ this.http.get<ResultBean<any[]>>(environment.SERVER_BASH_URL+"profession/getall").subscribe( result => { if(!!result.code){ debugger; this.professions = result.data; } } src/app/routes/reports/query/query.component.html
@@ -2,12 +2,14 @@ <h1>数据查询</h1> </div> <nz-card [nzBordered]="false"> <form nz-form (ngSubmit)="loadGrid()" [nzLayout]="'inline'"> <form nz-form [nzLayout]="'inline'"> <div nz-row [nzGutter]="24"> <div nz-col [nzSpan]="8" class="mb-md"> <div nz-form-item class="d-flex"> <div nz-form-label> <label>监测项目</label> <div [ngStyle]="{'width': '100px'}" nz-form-label> <label> 项目({{ sensorsSelect+'/'+sensorsLength }}) </label> </div> <div nz-form-control class="flex-1"> <nz-popover [nzPlacement]="'bottomLeft'" [(nzVisible)]="sensorSelectVisible" [nzTrigger]="'click'"> @@ -27,12 +29,19 @@ </div> </ng-template> </nz-popover> <!-- <div style="top:0; right: -62px; position:absolute; font-size: 16px; color: #696969;"> <span>(</span> <span style="display: inline-block; width: 50px; text-align: center;"> {{ sensorsSelect+'/'+sensorsLength }} </span> <span>)</span> </div> --> </div> </div> </div> <div nz-col [nzSpan]="8" class="mb-md"> <div nz-col [nzSpan]="9" class="mb-md"> <div nz-form-item class="d-flex"> <div nz-form-label> <div [ngStyle]="{'width': '120px'}" nz-form-label> <label>时间类型</label> </div> <div nz-form-control class="flex-1"> @@ -43,9 +52,9 @@ </div> </div> </div> <div nz-col [nzSpan]="8" class="mb-md"> <div nz-col [nzSpan]="7" class="mb-md"> <div nz-form-item class="d-flex"> <div nz-form-label> <div nz-form-label> <label>选择日期</label> </div> <div *ngIf="timeUnit.value!='MONTH'; else elseBlock" nz-form-control class="flex-1"> @@ -67,7 +76,7 @@ <div [ngStyle]="{'display':isCollapse ? 'none' : 'block' }" nz-row [nzGutter]="24"> <div nz-col [nzSpan]="8" class="mb-md"> <div nz-form-item class="d-flex"> <div [ngStyle]="{'width': '70px'}" nz-form-label> <div [ngStyle]="{'width': '100px'}" nz-form-label> <label>省市区</label> </div> <div nz-form-control class="flex-1"> @@ -77,21 +86,30 @@ </div> </div> </div> <div nz-col [nzSpan]="8" class="mb-md"> <div nz-col [nzSpan]="9" class="mb-md"> <div nz-form-item class="d-flex"> <div [ngStyle]="{'width': '70px'}" nz-form-label> <label>监控站点</label> <div [ngStyle]="{'width': '120px'}" nz-form-label> <label> <nz-dropdown> <button nz-button nz-dropdown ><span>{{dimensionItem.label}}</span> <i class="anticon anticon-down"></i></button> <ul nz-menu> <li *ngFor="let option of otherDimensions;let i = index;" nz-menu-item> <a (click)="selectDimension(option)">{{option.label}}</a> </li> </ul> </nz-dropdown> </label> </div> <div nz-form-control class="flex-1"> <nz-select name="monitorPoint" style="width: 100%;" [(ngModel)]="monitorPoint" nzAllowClear [nzPlaceHolder]="'选择 监控站点(输入名称搜索)'" nzShowSearch (nzSearchChange)="monitorPointsChange($event)" [nzNotFoundContent]="'无法找到'"> <nz-option *ngFor="let option of monitorPointOptions" [nzLabel]="option.name" [nzValue]="option"> <nz-select name="deviceDimension" style="width: 100%;" [(ngModel)]="deviceDimension" nzAllowClear [nzPlaceHolder]="'选择 '+ dimensionItem.label +'(输入名称搜索)'" nzShowSearch (nzSearchChange)="dimensionsChange($event)" [nzNotFoundContent]="'无法找到'"> <nz-option *ngFor="let option of dimensionOptions" [nzLabel]="option.name" [nzValue]="option"> </nz-option> </nz-select> </div> </div> </div> <div nz-col [nzSpan]="8" class="mb-md"> <div nz-col [nzSpan]="7" class="mb-md"> <div nz-form-item class="d-flex"> <div [ngStyle]="{'width': '70px'}" nz-form-label> <label>设 备</label> @@ -108,7 +126,7 @@ </div> <div nz-row> <div nz-col [nzSpan]="24" class="text-right"> <button nz-button [nzType]="'primary'"> <button nz-button [nzType]="'primary'" (click)="loadGrid()"> <i class="anticon anticon-search"></i> <span>查询</span> </button> src/app/routes/reports/query/query.component.ts
@@ -1,7 +1,7 @@ import { Component, OnInit, ViewChild } from '@angular/core'; import { _HttpClient } from '@delon/theme'; import { Sensor, Device, DataCondition, MonitorPoint, Organization, LineChartCriteria } from '@business/entity/data'; import { TimeUnits, AreaRange, ResultCode } from '@business/enum/types.enum'; import { TimeUnits, AreaRange, ResultCode, DeviceDimension } from '@business/enum/types.enum'; import { SensorsService } from '@business/services/http/sensors.service'; import { PageBean, ResultBean, Grid } from '@business/entity/grid'; import { NzTreeComponent } from 'ng-tree-antd'; @@ -24,6 +24,7 @@ styleUrls: ['./query.component.less'] }) export class QueryComponent implements OnInit { // aqi六项排序 private aqiSort = { e1: 1, @@ -33,6 +34,7 @@ e15: 5, e16: 6 }; public tableWidth = 2800; // private tableWidthOption = { // 'MONTH': 1400, @@ -88,9 +90,9 @@ this.isChartCollapse = !this.isChartCollapse; } public deviceOptions: Device[] = []; public dataCondition: DataCondition = {areaRangeId: 320583, areaRange: AreaRange.AREA }; public dataCondition: DataCondition = {areaRangeId: 320583, areaRange: AreaRange.AREA, deviceDimension:DeviceDimension.NONE}; public monitorPointOptions: MonitorPoint[] = []; public dimensionOptions: MonitorPoint[] = []; get actualYear(): number { return this.actualTime.getFullYear(); @@ -98,6 +100,23 @@ set actualYear(year) { this.actualTime.setFullYear(Number(year)); } dimensionsChange(text?: string){ switch(this.dimensionItem.value){ case DeviceDimension.MONITORPOINT: this.monitorPointsChange(text);break; case DeviceDimension.PROFESSION: this.professionsChange(text);break; } } professionsChange(text?: string){ this.http.get<ResultBean<any[]>>(environment.SERVER_BASH_URL+"profession/getall").subscribe( result => { if(!!result.code){ this.dimensionOptions = result.data; } } ); } monitorPointsChange(text?: string) { const pageBean: PageBean = { pageIndex: 0, pageSize: 20 }; const example = new ExampleService(); @@ -120,19 +139,21 @@ this.monitorPointService.getPageByExample(pageBean, example).subscribe( (res: PageBean) => { if (!!res && !!res.data) { this.monitorPointOptions = res.data; this.dimensionOptions = res.data; } } ); } devicesChange(text?: string) { if (!!this.monitorPoint) { if (!!this.deviceDimension) { const example = new ExampleService(); const deviceDimensionProperty = this.dimensionItem.value === DeviceDimension.MONITORPOINT ?'monitorPointId':'professionId'; if (!!text) { example.or().andEqualTo({ name: 'monitorPointId', value: this.monitorPoint.id }) example.or().andEqualTo({ name: deviceDimensionProperty, value: this.deviceDimension.id }) .andLike({name: 'text', value: text}); } else { example.or().andEqualTo({ name: 'monitorPointId', value: this.monitorPoint.id }); example.or().andEqualTo({ name: deviceDimensionProperty, value: this.deviceDimension.id }); } this.deviceService.getPageByExample(null, example).subscribe( (res: PageBean) => { @@ -164,7 +185,7 @@ private msg: NzMessageService, private dateService: DateService, ) { } ngOnInit() { ngOnInit() { this.initPage(); // 监测项目 tree click 事件 this.treeClickStream.debounceTime(1).subscribe( event => { @@ -207,6 +228,7 @@ this.reloadSensorNames(); }); } private initPage() { this.sensorsService.getPagingList(null, null).subscribe( (res: PageBean) => { @@ -253,6 +275,14 @@ } } ); this.dimensionItem = this.dimensions[0]; // this.dimensionsChange(); } public get sensorsLength():number { return this.sensorOptions.length>0?this.sensorOptions[0].children.length:0; } public get sensorsSelect():number{ return Object.keys(this._sensors).length; } public areaLazyLoad(event: { option: CascaderOption, index: number, resolve: (children: CascaderOption[]) => void, reject: () => void }) { const index = event['index']; @@ -289,27 +319,49 @@ }); if ( isChanged ) { this._areas = areas; this.monitorPoint = null; this.monitorPointsChange(); this.deviceDimension = null; if(this.dimensionItem.value === DeviceDimension.MONITORPOINT){ this.dimensionsChange(); } } } // 第二步 设置 监控站点, 值变 改变设备选项,值为null 置空设备选项和设备值 public _monitorPoint: MonitorPoint; get monitorPoint(): MonitorPoint { return this._monitorPoint; public dimensionItem:{label: string,value: DeviceDimension}; public dimensions:{label: string,value: DeviceDimension}[] = [ {label:"监控站点",value:DeviceDimension.MONITORPOINT}, {label:"监控行业",value:DeviceDimension.PROFESSION} ]; public get otherDimensions():{label: string,value: DeviceDimension}[] { return this.dimensions.filter( item => { return item.value != this.dimensionItem.value; } ); } set monitorPoint(value) { public selectDimension(option:{label: string,value: DeviceDimension}){ this.dimensionItem = option; this.dimensionsChange(); this._deviceDimension = null; // 清空设备选项 this.device = null; this.deviceOptions = null; } public _deviceDimension: {id: number,name: string}; get deviceDimension(): {id: number,name: string} { return this._deviceDimension; } set deviceDimension(value) { if (!!value) { // 值变 改变设备选项 if (this._monitorPoint !== value) { this._monitorPoint = value; // 此处不能提前也不能放后,设备改变要调用 if (this._deviceDimension !== value) { this._deviceDimension = value; // 此处不能提前也不能放后,设备改变要调用 this._device = null; // 设备值清空 this.devicesChange(); } // 值为null 置空设备选项和设备值 } else { this._monitorPoint = null; this._deviceDimension = null; this.device = null; this.deviceOptions = null; } @@ -440,22 +492,32 @@ this.dataCondition['actualTime'] = null; this.dataCondition['timeUnits'] = this.timeUnit.value; // 设置区域值 const mptValue: number = !!this._monitorPoint ? this._monitorPoint.id : null; const dimValue: number = !!this._deviceDimension ? this._deviceDimension.id : null; const devValue: number = !!this._device ? this._device.id : null; const areasData = [ devValue, mptValue, Number(this._areas.slice(-1).pop().value)]; const areasData = [ devValue, dimValue, Number(this._areas.slice(-1).pop().value)]; if(!!this.deviceDimension){ this.dataCondition.dimensionValue = this._deviceDimension.id; this.dataCondition.deviceDimension = this.dimensionItem.value; } for (let index = 0 ; index < areasData.length ; index++) { const item = areasData[index]; if ( item !== null ) { this.dataCondition.areaRangeId = item; switch (index) { case 0: this.dataCondition.areaRange = AreaRange.DEVICE; break; case 1: this.dataCondition.areaRange = AreaRange.MONITORPOINT; break; case 1: // 维度为监控点 if(this.dimensionItem.value === DeviceDimension.MONITORPOINT){ this.dataCondition.areaRange = AreaRange.MONITORPOINT; // 维度为行业 }else{ // 重新标定区域范围 this.switchAreas(); // 重新设置区域值 this.dataCondition.areaRangeId = areasData.slice(-1).pop(); } break; case 2: switch (this._areas.length ) { case 1: this.dataCondition.areaRange = AreaRange.PROVINCE; break; case 2: this.dataCondition.areaRange = AreaRange.CITY; break; case 3: this.dataCondition.areaRange = AreaRange.AREA; break; } this.switchAreas(); break; } break; @@ -547,6 +609,13 @@ } ); } private switchAreas(): void{ switch (this._areas.length ) { case 1: this.dataCondition.areaRange = AreaRange.PROVINCE; break; case 2: this.dataCondition.areaRange = AreaRange.CITY; break; case 3: this.dataCondition.areaRange = AreaRange.AREA; break; } } private reloadChart(): void { const timeList = this.grid.columns.map(item => item.text); if (!!this.echartsIntance) { @@ -613,22 +682,36 @@ public _chartTitleTemp = ''; public _tableTitleTemp = ''; public reloadChartTitle(): void { const names = ['辖区', '地区', '时间', '项目']; const names = ['辖区', '地区', '维度','时间','项目']; switch ( this.dataCondition.areaRange ) { case AreaRange.MONITORPOINT : names[0] = '监控站点'; names[1] = this._monitorPoint.name; break; names[1] = this._deviceDimension.name; break; case AreaRange.DEVICE : names[0] = '设备'; names[0] = '设备'; names[1] = this._device.name; break; default : names[0] = ''; names[1] = this._areas.map( item => item.label).join('/'); break; } names[2] = moment(this.actualTime).format(this._timeType.dateFormat); // 维度命名 if(!!this._deviceDimension){ switch(this.dataCondition.deviceDimension){ case DeviceDimension.PROFESSION : names[2] ='['+this._deviceDimension.name+']'; break; default : names[2] =''; break; } }else{ names[2] =''; } names[3] = moment(this.actualTime).format(this._timeType.dateFormat); if ( this.grid.data.length > this.chartSelectedIndex) { names[3] = this.grid.data[this.chartSelectedIndex].sensor.name; names[4] = this.grid.data[this.chartSelectedIndex].sensor.name; } const title = names.join(' ') + ' 报表'; if (title.trim() !== this._chartTitleTemp.trim()) {