| import { CoorPickerService } from 'app/routes/map/coordinates-picker/coordinates-picker.service'; | 
| import { AreaNames, MonitorPoint } from '@business/entity/data'; | 
| import { Version, ValueTransformer } from '@angular/compiler/src/util'; | 
| import { Subject } from 'rxjs/Subject'; | 
| import { Component, OnInit } from '@angular/core'; | 
| import { NzMessageService, NzModalService } from 'ng-zorro-antd'; | 
| import { ModalHelper } from '@delon/theme'; | 
| import { HttpClient } from '@angular/common/http'; | 
| import { environment } from 'environments/environment'; | 
| import { VersionService } from '@business/services/http/version.service'; | 
| import { Types } from '@business/enum/types.enum'; | 
| import { Column, Grid, PageBean, DataType } from '@business/entity/grid'; | 
| import { filter } from 'rxjs/operators/filter'; | 
| import { MonitorPointEditComponent } from 'app/routes/devices/monitor-point/monitor-point-edit/monitor-point-edit.component'; | 
| import { MonitorPointService } from '@business/services/http/monitor-point.service'; | 
| import { CoordinatesPickerComponent } from 'app/routes/map/coordinates-picker/coordinates-picker.component'; | 
| import { OrganizationService } from '@business/services/http/organization.service'; | 
| import { ExampleService } from '@business/services/util/example.service'; | 
|   | 
|   | 
| @Component({ | 
|   selector: 'app-monitor-point', | 
|   templateUrl: './monitor-point.component.html', | 
|   styles: [] | 
| }) | 
| export class MonitorPointComponent implements OnInit { | 
|   | 
|   public orgOptions = []; | 
|   private monitorPoint: MonitorPoint; | 
|   grid: Grid<MonitorPoint> = new Grid(null); | 
|   queryMap: { mpointName?: string, organizationId?: number } = { mpointName: null, organizationId: null }; | 
|   queryTextStream: Subject<string> = new Subject<string>(); | 
|   private initPage() { | 
|     this.monitorPoint = { | 
|       name: { | 
|         text: '名称', | 
|         width: '300px' | 
|       }, | 
|       address: { | 
|         text: '地址', | 
|         width: '300px', | 
|         format: (value: any, col: Column, row: any) => { | 
|           value = value == null ? '' : value; | 
|           if (row['areaNames'] != null) { | 
|             return row['areaNames']['provinceName']  | 
|               + (!!row['areaNames']['cityName'] ? row['areaNames']['cityName'] : '') | 
|               + (!!row['areaNames']['areaName'] ? row['areaNames']['areaName'] : '') | 
|               + (!!row['areaNames']['townName'] ? row['areaNames']['townName'] : '') | 
|               + (!!row['areaNames']['villageName'] ? row['areaNames']['villageName'] : '') | 
|               + value; | 
|           } else { | 
|             return value; | 
|           } | 
|   | 
|         } | 
|       }, | 
|       description: { | 
|         text: '描述', | 
|         width: '300px' | 
|       } | 
|     }; | 
|     this.grid.title = '监控站点'; | 
|     this.grid.setColumns(this.monitorPoint); | 
|     this.grid.pageSize = 10; | 
|   } | 
|   constructor( | 
|     private coorPickerService: CoorPickerService, | 
|     private monitorPointService: MonitorPointService, | 
|     private confirmServ: NzModalService, | 
|     public msgSrv: NzMessageService, | 
|     private modalHelper: ModalHelper, | 
|     private organizationService: OrganizationService | 
|   ) { } | 
|   | 
|   ngOnInit() { | 
|     this.initPage(); | 
|     this.queryTextStream | 
|       .debounceTime(500) | 
|       .distinctUntilChanged() | 
|       .subscribe(queryText => { | 
|         this.load(); | 
|       }); | 
|     this.orgSelectChange(); | 
|   } | 
|  public setOrganizationId(orgId) { | 
|     this.queryMap.organizationId = orgId; | 
|     this.load(); | 
|   } | 
|   queryTextChanged($event) { | 
|     this.queryTextStream.next(this.queryMap.mpointName); | 
|   } | 
|   load(reload: boolean = false) { | 
|     if (reload) { | 
|       this.grid.pageIndex = 1; | 
|     } | 
|     // 延时加载避免ExpressionChangedAfterItHasBeenCheckedError | 
|     setTimeout(() => { | 
|       this.grid.loading = true; | 
|     }, 1); | 
|     const example = new ExampleService(); | 
|     const organizationId = !!this.queryMap.organizationId ? this.queryMap.organizationId : null; | 
|     const mpointName = !!this.queryMap.mpointName ? '%' + this.queryMap.mpointName + '%' : null; | 
|     example.or() | 
|     .andEqualTo({name: 'organizationId', value: organizationId }) | 
|     .andLike({name: 'name', value: mpointName  }); | 
|     this.monitorPointService.getPageByExample(this.grid, example).subscribe( | 
|       (res: PageBean) => { | 
|         this.grid.loading = true; | 
|         if (res != null && res.data != null) { | 
|           this.grid.initData(res); | 
|           this.grid.refreshStatus(); | 
|           setTimeout(() => { | 
|             this.grid.loading = false; | 
|           }, 1); | 
|         } | 
|       } | 
|     ); | 
|   } | 
|   | 
|   // rowData为null时,为新增 | 
|   addOrModify(d) { | 
|     const data = {}; | 
|     if (d != null) { | 
|       Object.assign(data, d); | 
|     } | 
|     let configMap = {}; | 
|     configMap = Object.assign(configMap, this.queryMap); | 
|     this.modalHelper.static(MonitorPointEditComponent, { data, configMap }).subscribe( | 
|       (ret: { data: any, close: Function }) => { | 
|         // 修改状态 | 
|         if (ret.data['index'] != null) { | 
|           const index: number = ret.data['index']; | 
|           const origData = this.grid.data[index]; | 
|           const isModified = Object.keys(origData).some( | 
|             (key: string) => { | 
|               return ret.data[key] !== origData[key]; | 
|             } | 
|           ); | 
|           // 未作修改 | 
|           if (!isModified) { | 
|             ret.close(); | 
|             this.msgSrv.success(this.grid.title + '未作任何修改!'); | 
|             return; | 
|           } | 
|         } | 
|         this.monitorPointService.save(ret.data).subscribe( | 
|           (res: any) => { | 
|             if (res.code === 1) { | 
|               this.load(); | 
|               ret.close(); | 
|               this.msgSrv.success(this.grid.title + '保存成功!'); | 
|             } | 
|           } | 
|         ); | 
|       }); | 
|   } | 
|   | 
|   delete(...id: number[]) { | 
|     this.monitorPointService.delete(...id).subscribe( | 
|       (res: any) => { | 
|         if (res.code === 1) { | 
|           this.load(); | 
|           this.msgSrv.success(this.grid.title + '删除成功!'); | 
|         } | 
|       } | 
|     ); | 
|   } | 
|   | 
|   deleteSelected() { | 
|     this.confirmServ.confirm({ | 
|       title: '批量删除', | 
|       content: '注意:数据一旦删除,将不可恢复!', | 
|       okText: '确定', | 
|       cancelText: '取消' | 
|     }).on('onOk', () => { | 
|       if (this.grid.selectedIndexs != null && this.grid.selectedIndexs.length > 0) { | 
|         const ids = this.grid.selectedIndexs.map( | 
|           (index: number) => { | 
|             const id = this.grid.data[index].id; | 
|             return Number.parseInt(id); | 
|           } | 
|         ); | 
|         this.delete(...ids); | 
|       } | 
|     }); | 
|   } | 
|   sort(field: string, value: string) { | 
|     // 删除当前field | 
|     this.grid.sorts = this.grid.sorts.filter( | 
|       (fn: string) => { | 
|         return fn !== field; | 
|       } | 
|     ); | 
|     // 如果value不为null,在排序数组最后加上filed | 
|     if (value != null) { | 
|       this.grid.sorts.push(field); | 
|     } | 
|     this.load(); | 
|   } | 
|   configCoord(record: MonitorPoint): void { | 
|     Object.assign(this.coorPickerService.data, record); | 
|     const _data = this.coorPickerService.data; | 
|     const areaNames = record.areaNames; | 
|     let adress = ''; | 
|     if (areaNames != null) { | 
|       adress += !!areaNames.provinceName ? areaNames.provinceName : ''; | 
|       adress += ' '; | 
|       adress += !!areaNames.cityName ? areaNames.cityName : ''; | 
|       adress += ' '; | 
|       adress += !!areaNames.areaName ? areaNames.areaName : ''; | 
|       adress += ' '; | 
|       adress += !!record.address ? record.address : ''; | 
|     } | 
|     this.coorPickerService.data.address = adress; | 
|     this.coorPickerService.data['describe'] = '监控站点名称'; | 
|     this.modalHelper.static(CoordinatesPickerComponent).subscribe( | 
|       (staticComp) => { | 
|         const data: MonitorPoint = { | 
|           id: record.id, | 
|           longitude: _data.longitude, | 
|           latitude: _data.latitude, | 
|         }; | 
|         this.monitorPointService.save(data).subscribe( | 
|           (res: any) => { | 
|             if (res.code === 1) { | 
|               this.load(); | 
|               this.msgSrv.success('坐标配置成功!'); | 
|             } | 
|           } | 
|         ); | 
|   | 
|       } | 
|     ); | 
|   } | 
|   orgSelectChange(text?: string) {     | 
|     const pageBean: PageBean = {pageIndex: 0, pageSize: 20}; | 
|     this.organizationService.getPagingList(pageBean, text).subscribe( | 
|       (res: PageBean) => { | 
|            if (res != null && res.data != null) {                | 
|                this.orgOptions = res.data; | 
|            } | 
|       } | 
|    ); | 
|   } | 
| } |