34 changed files with 2804 additions and 425 deletions
@ -0,0 +1,34 @@
|
||||
<div class="box"> |
||||
<div class="top"> |
||||
<span style="font-size: 20px;">修改内容</span> |
||||
</div> |
||||
<div class="queryField"> |
||||
<label style="margin-right: 10px;">名称:</label> |
||||
<!-- <mat-form-field class="example-full-width"> |
||||
<input matInput placeholder="请输入表头名称" [(ngModel)]="headName" autocomplete="off" readonly> |
||||
</mat-form-field> --> |
||||
<span>{{headName}}</span> |
||||
</div> |
||||
<div class="queryField" *ngIf="level==1"> |
||||
<label style="margin-right: 10px;">列数:</label> |
||||
<mat-form-field class="example-full-width"> |
||||
<input matInput type="number" [(ngModel)]="data.tableth.length" autocomplete="off" required [min]="lieNumber"> |
||||
</mat-form-field> |
||||
</div> |
||||
<div class="queryField" *ngIf="level==2"> |
||||
<label style="margin-right: 10px;">列数:</label> |
||||
<mat-form-field class="example-full-width"> |
||||
<input matInput type="number" [(ngModel)]="data.tableth[0].length" autocomplete="off" required [min]="lieNumber"> |
||||
</mat-form-field> |
||||
</div> |
||||
<div class="queryField" *ngIf="level==2"> |
||||
<label style="margin-right: 10px;">行数:</label> |
||||
<mat-form-field class="example-full-width"> |
||||
<input matInput type="number" [(ngModel)]="data.tableth.length" autocomplete="off" required [min]="hNumber"> |
||||
</mat-form-field> |
||||
</div> |
||||
<div class="bottom"> |
||||
<button mat-raised-button color="primary" (click)='newdisaster()'>确定</button> |
||||
<button mat-raised-button style="margin-left: 50px;" (click)='close()'>取消</button> |
||||
</div> |
||||
</div> |
||||
@ -0,0 +1,153 @@
|
||||
<!-- 报表统计 --> |
||||
<div style="height: 100%;overflow: auto;"> |
||||
<mat-tab-group style="height: 100%;" [selectedIndex]="selected.value" (selectedIndexChange)="selectedIndexChange($event)"> |
||||
<mat-tab *ngFor="let item of lable" [label]="item"> |
||||
<ng-template matTabContent> |
||||
<form (ngSubmit)="onSubmit(form.value)" #form="ngForm"> |
||||
<div class="header"> |
||||
<div class="queryBox"> |
||||
<div class="queryField ordiv"> |
||||
<label style="margin-right: 10px;">消防救援站:</label> |
||||
<mat-form-field class="example-full-width"> |
||||
<input readonly matInput placeholder="请选择消防救援站" autocomplete="off" *ngIf="preparelevels==0" [(ngModel)]="js" name="js" |
||||
(focus)="openorganizationbox()"> |
||||
<input readonly matInput placeholder="请选择消防救援站" autocomplete="off" *ngIf="preparelevels==1" [(ngModel)]="yuanjs" name="js" |
||||
(focus)="openorganizationbox()"> |
||||
</mat-form-field> |
||||
<mat-checkbox style="margin-left: 6px;" color="primary" *ngIf="preparelevels==0" [(ngModel)]="jscheck" name="jscheck">包含下级</mat-checkbox> |
||||
<mat-checkbox style="margin-left: 6px;" color="primary" *ngIf="preparelevels==1" [(ngModel)]="yuanjscheck" name="jscheck">包含下级</mat-checkbox> |
||||
<div class="organizationbox" *ngIf="isorganizationbox"> |
||||
<div (click)="closediv()" class="closediv"> |
||||
<mat-icon>clear</mat-icon> |
||||
</div> |
||||
<mat-tree [dataSource]="dataSource" [treeControl]="treeControl"> |
||||
<mat-tree-node *matTreeNodeDef="let node" matTreeNodePadding (click)='add(node)' class="organizationlist"> |
||||
<button type="button" mat-icon-button disabled></button> |
||||
<li>{{node.name}}</li> |
||||
</mat-tree-node> |
||||
<mat-tree-node *matTreeNodeDef="let node;when: hasChild" matTreeNodePadding (click)='add(node)' |
||||
class="organizationlist"> |
||||
<button type="button" mat-icon-button matTreeNodeToggle [attr.aria-label]="'toggle ' + node.name"> |
||||
<mat-icon class="mat-icon-rtl-mirror"> |
||||
{{treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'}} |
||||
</mat-icon> |
||||
</button> |
||||
<li>{{node.name}}</li> |
||||
</mat-tree-node> |
||||
</mat-tree> |
||||
</div> |
||||
</div> |
||||
<div class="queryField" > |
||||
<label style="margin-right: 10px;">时间查询:</label> |
||||
<mat-form-field class="example-full-width"> |
||||
<input type="date" matInput name="addtime" autocomplete="off" [(ngModel)]="dwaddtime" *ngIf="preparelevels==0"> |
||||
<input type="date" matInput name="addtime" autocomplete="off" [(ngModel)]="yuanaddtime" *ngIf="preparelevels==1"> |
||||
</mat-form-field> |
||||
<!-- <mat-icon aria-hidden="false" style="position: relative;right: 120px;top: 5px;">arrow forward</mat-icon> --> |
||||
<span style="margin-left: 15px;">🠊</span> |
||||
<mat-form-field class="example-full-width" style="margin-left: 10px;"> |
||||
<input type="date" matInput name="endtime" autocomplete="off" [(ngModel)]="dwendtime" *ngIf="preparelevels==0"> |
||||
<input type="date" matInput name="endtime" autocomplete="off" [(ngModel)]="yuanendtime" *ngIf="preparelevels==1"> |
||||
</mat-form-field> |
||||
</div> |
||||
<div class="queryField" *ngIf="preparelevels==1"> |
||||
<label style="margin-right: 10px;">预案类型:</label> |
||||
<mat-form-field> |
||||
<mat-select [(ngModel)]="reservePlanType" name="reservePlanType" placeholder='请选择预案类型' [multiple]="true"> |
||||
<mat-option value=1>二维预案</mat-option> |
||||
<mat-option value=2>三维预案</mat-option> |
||||
<mat-option value=4>其他预案</mat-option> |
||||
<mat-option value=16>文本预案</mat-option> |
||||
</mat-select> |
||||
</mat-form-field> |
||||
|
||||
</div> |
||||
<div class="queryField" *ngIf="preparelevels==0"> |
||||
<label style="margin-right: 10px;">单位类型:</label> |
||||
<mat-form-field> |
||||
<mat-select placeholder='请选择单位类型' [(ngModel)]="unittype" name="unittype" [multiple]="true"> |
||||
<mat-option *ngFor="let unit of allunittype" [value]="unit.id"> |
||||
{{unit.name}} |
||||
</mat-option> |
||||
</mat-select> |
||||
</mat-form-field> |
||||
</div> |
||||
<div class="queryField" *ngIf="preparelevels==0"> |
||||
<label style="margin-right: 10px;">单位状态:</label> |
||||
<mat-form-field> |
||||
<mat-select required [(ngModel)]="preparelevel" name="preparelevel" placeholder='请选择单位状态' [multiple]="true"> |
||||
<mat-option [value]='preparelevel[0]'>新增</mat-option> |
||||
<mat-option [value]='preparelevel[1]||2'>维护更新</mat-option> |
||||
</mat-select> |
||||
</mat-form-field> |
||||
</div> |
||||
<div class="queryField" *ngIf="preparelevels==1"> |
||||
<label style="margin-right: 10px;">预案级别:</label> |
||||
<mat-form-field> |
||||
<mat-select placeholder='请选择预案级别' [(ngModel)]="planCategory" name="planCategory" [multiple]="true"> |
||||
<mat-option value=1>Ⅰ级预案</mat-option> |
||||
<mat-option value=2>Ⅱ级预案</mat-option> |
||||
<mat-option value=3>Ⅲ级预案</mat-option> |
||||
<mat-option value=4>Ⅳ级预案</mat-option> |
||||
<mat-option value=5>Ⅴ级预案</mat-option> |
||||
</mat-select> |
||||
</mat-form-field> |
||||
</div> |
||||
<div class="queryField" *ngIf="preparelevels==0"> |
||||
<label style="margin-right: 10px;">按总数排序:</label> |
||||
<mat-form-field> |
||||
<mat-select placeholder='请选择排序方式' [(ngModel)]="integritySort" name="integritySort"> |
||||
<mat-option value=1>从高到低</mat-option> |
||||
<mat-option value=0>从低到高</mat-option> |
||||
</mat-select> |
||||
</mat-form-field> |
||||
</div> |
||||
<div class="queryField" *ngIf="preparelevels==1"> |
||||
<label style="margin-right: 10px;">按总数排序:</label> |
||||
<mat-form-field> |
||||
<mat-select placeholder='请选择排序方式' [(ngModel)]="yuanintegritySort" name="integritySort"> |
||||
<mat-option value=1>从高到低</mat-option> |
||||
<mat-option value=0>从低到高</mat-option> |
||||
</mat-select> |
||||
</mat-form-field> |
||||
</div> |
||||
<div class="queryField" *ngIf="preparelevels==0||preparelevels==1"> |
||||
<button mat-raised-button color="primary">查询</button> |
||||
<button mat-raised-button style="margin-left: 25px;" type="button" (click)="reset()">重置</button> |
||||
<button mat-raised-button style="margin-left: 25px;" color="primary" (click)='export()'>导出</button> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
|
||||
</form> |
||||
<mat-divider></mat-divider> |
||||
<div class="body"> |
||||
<div class="tablebox" id="table"> |
||||
<table cellpadding="0" cellspacing="0" *ngIf="preparelevels==0&&!tableDataNull"> |
||||
<thead> |
||||
<th *ngFor="let item of displayedColumns;let i=index">{{item}}</th> |
||||
</thead> |
||||
<tbody> |
||||
<tr *ngFor="let element of tabledataSource"> |
||||
<td *ngFor="let eletd of element.name">{{eletd}}</td> |
||||
</tr> |
||||
</tbody> |
||||
</table> |
||||
<table cellpadding="0" cellspacing="0" *ngIf="preparelevels==1&&!tableDataNull"> |
||||
<thead> |
||||
<th *ngFor="let item of yuanColumns;let i=index">{{item}}</th> |
||||
</thead> |
||||
<tbody> |
||||
<tr *ngFor="let element of yuanTable"> |
||||
<td *ngFor="let eletd of element.name">{{eletd}}</td> |
||||
</tr> |
||||
</tbody> |
||||
</table> |
||||
<span *ngIf="tableDataNull">暂无数据</span> |
||||
</div> |
||||
</div> |
||||
</ng-template> |
||||
</mat-tab> |
||||
|
||||
</mat-tab-group> |
||||
</div> |
||||
@ -0,0 +1,265 @@
|
||||
.header { |
||||
width: 100%; |
||||
padding: 12px 10px; |
||||
box-sizing: border-box; |
||||
.queryBox { |
||||
box-sizing: border-box; |
||||
padding: 5px 0 0 5px; |
||||
// margin-left: 50px; |
||||
display: flex; |
||||
flex-direction: row; |
||||
flex-wrap: wrap; |
||||
align-items:center; |
||||
// justify-content:center; |
||||
.queryField { |
||||
//margin: 0 10px; |
||||
input { |
||||
width: 180px; |
||||
height: 22px; |
||||
line-height: 22px; |
||||
border-radius: 3px; |
||||
} |
||||
@media screen and (min-device-width:1400px){ |
||||
margin: 3px 20px; |
||||
} |
||||
@media screen and (max-device-width:1400px)and (min-device-width:1200px){ |
||||
margin: 3px 10px; |
||||
mat-form-field{ |
||||
width: 180px; |
||||
} |
||||
} |
||||
@media screen and (max-device-width:1200px){ |
||||
margin: 3px 0 3px 10px; |
||||
mat-form-field{ |
||||
width: 120px; |
||||
} |
||||
} |
||||
|
||||
} |
||||
|
||||
|
||||
} //queryBox |
||||
.butclass{ |
||||
button{ |
||||
width: 80px;height: 36px; |
||||
font-size: 16px; |
||||
} |
||||
} |
||||
.ordiv{ |
||||
position: relative; |
||||
.organizationbox{ |
||||
width:450px; |
||||
height: 200px; |
||||
background: white; |
||||
position: absolute; |
||||
top: 48px; |
||||
left: 77px; |
||||
z-index: 999; |
||||
border: 1px solid grey; |
||||
overflow-y: auto; |
||||
li{ |
||||
overflow: hidden; |
||||
text-overflow: ellipsis; |
||||
white-space: nowrap; |
||||
} |
||||
mat-tree-node{ |
||||
cursor: pointer; |
||||
white-space:pre; |
||||
} |
||||
mat-tree-node:hover{ |
||||
background: rgba(225, 225, 225, 0.8); |
||||
} |
||||
.closediv{ |
||||
z-index: 100; |
||||
position: absolute; |
||||
right: 0; |
||||
top: 0; |
||||
width: 30px; |
||||
height: 30px; |
||||
cursor: pointer; |
||||
line-height: 30px; |
||||
text-align: center; |
||||
} |
||||
.closediv:hover{ |
||||
background:rgba(225, 225, 225, 0.8); |
||||
} |
||||
} |
||||
|
||||
} |
||||
} |
||||
.body{ |
||||
height: 100%; |
||||
width: 100%; |
||||
.buttonbox{ |
||||
padding-left: 50px; |
||||
button{ |
||||
margin:0 10px |
||||
} |
||||
} |
||||
.tablebox{ |
||||
height: 620px; |
||||
overflow-y: auto; |
||||
//margin-bottom: 15px; |
||||
table{ |
||||
width: 100%; |
||||
background-color: white; |
||||
margin-top: 15px; |
||||
table-layout: fixed; |
||||
thead,tr{ |
||||
border-bottom: 1px solid grey; |
||||
} |
||||
th { |
||||
border-bottom: 1px solid #999; |
||||
//width: 30%; |
||||
font-size: 16px; |
||||
text-align: center; |
||||
height: 60px; |
||||
line-height: 60px; |
||||
} |
||||
td { |
||||
|
||||
height: 50px; |
||||
//line-height: 50px; |
||||
text-align: center; |
||||
font-size: 16px; |
||||
margin-left: 3px; |
||||
border-bottom: 1px solid #999; |
||||
.spantext{ |
||||
margin-left: 7px; |
||||
} |
||||
.buleColor{ |
||||
color: #2196f3; |
||||
} |
||||
} |
||||
} |
||||
mat-paginator{ |
||||
width:100%; |
||||
// margin-left: 2%; |
||||
// margin-top: 30px; |
||||
} |
||||
} |
||||
} |
||||
.mat-header-cell{ |
||||
text-align: center; |
||||
} |
||||
.mat-cell{ |
||||
text-align: center; |
||||
|
||||
} |
||||
|
||||
//完整度 |
||||
.integrityDiv{ |
||||
width: 180px; |
||||
height: 30px; |
||||
background-color: #e2e7ee; |
||||
// background-image: linear-gradient(to right, #e2e7ee ,#FF4500, #FF8C00,#32cd32); |
||||
margin: 0 auto; |
||||
position: relative; |
||||
.integrityNum{ |
||||
position: absolute; |
||||
left: 50%; |
||||
top: 50%; |
||||
transform: translate(-50%, -50%); |
||||
color: black; |
||||
font-weight: 800; |
||||
font-size: 15px; |
||||
cursor: default; |
||||
} |
||||
.integrityColorDiv{ |
||||
height: 100%; |
||||
} |
||||
.integrityDetails{ |
||||
position: absolute; |
||||
display: none; |
||||
width: 350px; |
||||
height:280px; |
||||
border: 1px solid rgba(0, 0, 0, 0.22); |
||||
background-color: white; |
||||
.integrityDetailsTop{ |
||||
width: 100%; |
||||
height: 23px; |
||||
line-height:23px; |
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.22); |
||||
margin-bottom: 1px; |
||||
font-size: 14px; |
||||
span{ |
||||
display: inline-block; |
||||
text-align: center; |
||||
font-weight: 800; |
||||
} |
||||
.span1{ |
||||
width: 25%; |
||||
} |
||||
.span2{ |
||||
width: 60%; |
||||
} |
||||
.span3{ |
||||
width: 15%; |
||||
} |
||||
} |
||||
.integrityDetailsBody{ |
||||
ul{ |
||||
li{ |
||||
width: 100%; |
||||
height: 23px; |
||||
line-height: 23px; |
||||
margin: 3px 0; |
||||
div{ |
||||
float: left; |
||||
font-size: 13px; |
||||
} |
||||
.name{ |
||||
width: 25%; |
||||
height: 100%; |
||||
} |
||||
.colorDiv{ |
||||
width: 60%; |
||||
height: 100%; |
||||
position: relative; |
||||
.colorDivBac{ |
||||
width: 90%; |
||||
height: 100%; |
||||
position: absolute; |
||||
left: 50%; |
||||
top: 50%; |
||||
transform: translate(-50%,-50%); |
||||
background-color: #dfe5ec; |
||||
border-radius: 5px; |
||||
.colorDivCon{ |
||||
border-radius: 5px; |
||||
height: 100%; |
||||
background-color: #2398f1; |
||||
} |
||||
} |
||||
span{ |
||||
position: absolute; |
||||
left: 50%; |
||||
top: 50%; |
||||
transform: translate(-50%,-50%); |
||||
// color: white; |
||||
font-weight: 600; |
||||
} |
||||
} |
||||
.number{ |
||||
width: 15%; |
||||
height: 100%; |
||||
} |
||||
} |
||||
} |
||||
|
||||
} |
||||
} |
||||
.bottomposition{ |
||||
top: 2px; |
||||
left: 188px; |
||||
} |
||||
.topposition{ |
||||
top: -252px; |
||||
left: 188px; |
||||
} |
||||
} |
||||
.integrityDiv:hover{ |
||||
.integrityDetails{ |
||||
display: block; |
||||
} |
||||
} |
||||
@ -0,0 +1,25 @@
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing'; |
||||
|
||||
import { CombinedQueryComponent } from './combined-query.component'; |
||||
|
||||
describe('CombinedQueryComponent', () => { |
||||
let component: CombinedQueryComponent; |
||||
let fixture: ComponentFixture<CombinedQueryComponent>; |
||||
|
||||
beforeEach(async(() => { |
||||
TestBed.configureTestingModule({ |
||||
declarations: [ CombinedQueryComponent ] |
||||
}) |
||||
.compileComponents(); |
||||
})); |
||||
|
||||
beforeEach(() => { |
||||
fixture = TestBed.createComponent(CombinedQueryComponent); |
||||
component = fixture.componentInstance; |
||||
fixture.detectChanges(); |
||||
}); |
||||
|
||||
it('should create', () => { |
||||
expect(component).toBeTruthy(); |
||||
}); |
||||
}); |
||||
@ -0,0 +1,567 @@
|
||||
import { Component, OnInit, ViewChild, Inject } from '@angular/core'; |
||||
import { HttpClient } from '@angular/common/http' |
||||
import { MatTreeFlatDataSource, MatTreeFlattener } from '@angular/material/tree'; |
||||
import { MatPaginator } from '@angular/material/paginator'; |
||||
import { FlatTreeControl } from '@angular/cdk/tree'; |
||||
import { FormControl } from '@angular/forms'; |
||||
import { Router, ActivatedRoute } from '@angular/router' |
||||
import { PageEvent } from '@angular/material/paginator'; |
||||
import { MatDialogRef, MatDialog, MAT_DIALOG_DATA } from '@angular/material/dialog'; |
||||
import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar'; |
||||
import { TreeService } from '../../http-interceptors/tree.service' |
||||
import { Viewer } from 'photo-sphere-viewer'; |
||||
import { timeStamp } from 'console'; |
||||
|
||||
@Component({ |
||||
selector: 'app-combined-query', |
||||
templateUrl: './combined-query.component.html', |
||||
styleUrls: ['./combined-query.component.scss'] |
||||
}) |
||||
export class CombinedQueryComponent implements OnInit { |
||||
|
||||
constructor(private http: HttpClient, private router: Router, private route: ActivatedRoute, private tree: TreeService, public dialog: MatDialog, public snackBar: MatSnackBar) { } |
||||
|
||||
ngOnInit(): void { |
||||
if (window.matchMedia("(max-width: 1400px)").matches) { |
||||
this.pcMore = false |
||||
this.padMore = true |
||||
this.pcfind = false |
||||
this.padjt = true |
||||
} else { |
||||
this.pcfind = true |
||||
this.pcMore = true |
||||
this.padMore = false |
||||
this.padjt = false |
||||
} |
||||
this.getunitdata(); |
||||
this.getOrganizations(); |
||||
this.getUnittype(); |
||||
this.getAllPlanInfo(); |
||||
let level = sessionStorage.getItem("level"); |
||||
this.url = window.location.href.substring(window.location.href.length - 1, window.location.href.length) |
||||
} |
||||
private _transformer = (node, level: number) => { //初始化tree
|
||||
return { |
||||
expandable: !!node.children && node.children.length > 0, |
||||
name: node.name, |
||||
level: level, |
||||
id: node.id, |
||||
parentId: node.parentId, |
||||
children: node.children |
||||
}; |
||||
} |
||||
treeControl = new FlatTreeControl<any>(node => node.level, node => node.expandable); |
||||
treeFlattener = new MatTreeFlattener(this._transformer, node => node.level, node => node.expandable, node => node.children); |
||||
dataSource = new MatTreeFlatDataSource(this.treeControl, this.treeFlattener); |
||||
myControl = new FormControl(); |
||||
hasChild = (_: number, node: any) => node.expandable; |
||||
displayedColumns: string[] = ['组织名称', '总数'];//, 'addtime', 'plantype', 'auditStatus', 'openRange', 'projectlevel', 'operation'
|
||||
yuanColumns:string[]=['组织名称', '总数']; |
||||
allorganizations: any //所有组织机构
|
||||
allunittype: any //所有单位类型
|
||||
tabledataSource=[] //单位表格数据
|
||||
yuanTable=[]//预案表格数据
|
||||
excelData:any |
||||
url |
||||
findTj=0//查询条件
|
||||
|
||||
preparelevels:Number=0 |
||||
pcMore//pc更多
|
||||
pcput = false//pc收起
|
||||
pcfind//pc查询
|
||||
padjt = false |
||||
padMore = true//pad收缩控制
|
||||
padput = false//pad收起按钮
|
||||
imgsrcopen = "../../../assets/images/routdown2.png" |
||||
imgsrcdown = "../../../assets/images/routup2.png" |
||||
pcInfo() { |
||||
this.pcMore = !this.pcMore |
||||
this.pcput = !this.pcput |
||||
} |
||||
padInfo() { |
||||
this.padMore = !this.padMore |
||||
this.padput = !this.padput |
||||
} |
||||
|
||||
allPlanInfo: any //存储所有预案信息
|
||||
lable=['单位查询','预案查询'] |
||||
selected = new FormControl(0); //选项卡实例
|
||||
//判断选了哪一个
|
||||
selectedIndexChange(e){ |
||||
this.selected.setValue(e) |
||||
this.preparelevels=Number(e) |
||||
this.getAllPlanInfo() |
||||
} |
||||
//获得所有预案或单位信息
|
||||
tableDataNull=false |
||||
async getAllPlanInfo() { |
||||
/* this.planCategory=new Array<number>(); |
||||
this.reservePlanType=new Array<number>(); */ |
||||
let paramsdata:any={ |
||||
QueryMode:this.preparelevels, |
||||
OrganizationId:this.jsId||'', |
||||
HasChildren:this.jscheck||'', |
||||
TimeIntervalStart:this.dwaddtime||'', |
||||
TimeIntervalEnd:this.dwendtime||'', |
||||
BuildingTypeIds:this.unittype||[], |
||||
CompanyStatuses:this.preparelevel||[], |
||||
SortBy:'totalCount', |
||||
SortType:this.integritySort |
||||
} |
||||
let yuandata={ |
||||
QueryMode:this.preparelevels, |
||||
OrganizationId:this.yuanjsId||'', |
||||
HasChildren:this.yuanjscheck||'', |
||||
TimeIntervalStart:this.yuanaddtime||'', |
||||
TimeIntervalEnd:this.yuanendtime||'', |
||||
PlanCategories:this.planCategory||[], |
||||
PlanTypes:this.reservePlanType||[], |
||||
SortBy:'totalCount', |
||||
SortType:this.yuanintegritySort |
||||
} |
||||
let result = await new Promise((resolve, reject)=>{ |
||||
this.http.get("/api/StatisticsAnalysis/ReportTable", { params:this.preparelevels==0? paramsdata:yuandata }).subscribe((data: any) => { |
||||
console.log(data) |
||||
this.excelData=data |
||||
if(data.length==0){ |
||||
this.tableDataNull=true |
||||
}else{ |
||||
this.tableDataNull=false |
||||
if(this.preparelevels==0){ |
||||
//单位查询
|
||||
if(this.preparelevel.length==0){ |
||||
//必须选择单位状态
|
||||
let config = new MatSnackBarConfig(); |
||||
config.verticalPosition = 'top'; |
||||
config.duration = 3000 |
||||
this.snackBar.open('请选择单位状态', '确定', config); |
||||
}else{ |
||||
this.tabledataSource=[] |
||||
this.displayedColumns=['组织名称', '总数'] |
||||
data.forEach((element,i,value) => { |
||||
this.tabledataSource.push({name:[element.orgName,element.companyStatistics.totalCount]}) |
||||
if(value[0].companyStatistics.buildingTypesCounts!=null){ |
||||
value[i].companyStatistics.buildingTypesCounts.forEach((build,bi,bvalue) => { |
||||
if(i==0){ |
||||
this.displayedColumns.push(value[0].companyStatistics.buildingTypesCounts[bi].buildingTypeName) |
||||
this.tabledataSource[0].name.push(value[0].companyStatistics.buildingTypesCounts[bi].count) |
||||
}else{ |
||||
this.tabledataSource[i].name.push(bvalue[bi].count) |
||||
} |
||||
/* this.tabledataSource.forEach((td,ti,tval)=>{ |
||||
tval[ti].name.push(item.count) |
||||
}) */ |
||||
}); |
||||
|
||||
} |
||||
}); |
||||
} |
||||
} |
||||
else if(this.preparelevels==1){ |
||||
//预案查询
|
||||
this.yuanColumns=['组织名称', '总数'] |
||||
this.yuanTable=[{name:[0,0]}] |
||||
if(this.planCategory.length!=0){ |
||||
this.planCategory.forEach(element=>{ |
||||
if(element==1){ |
||||
this.yuanColumns.push('Ⅰ级') |
||||
this.yuanTable[0].name.push(0) |
||||
}else if(element==2){ |
||||
this.yuanColumns.push('Ⅱ级') |
||||
this.yuanTable[0].name.push(0) |
||||
}else if(element==3){ |
||||
this.yuanColumns.push('Ⅲ级') |
||||
this.yuanTable[0].name.push(0) |
||||
}else if(element==4){ |
||||
this.yuanColumns.push('Ⅳ级') |
||||
this.yuanTable[0].name.push(0) |
||||
}else if(element==5){ |
||||
this.yuanColumns.push('Ⅴ级') |
||||
this.yuanTable[0].name.push(0) |
||||
} |
||||
}) |
||||
} |
||||
if(this.reservePlanType.length!=0){ |
||||
this.reservePlanType.forEach(element => { |
||||
if(element==1){ |
||||
this.yuanColumns.push('二维') |
||||
this.yuanTable[0].name.push(0) |
||||
}else if(element==2){ |
||||
this.yuanColumns.push('三维') |
||||
this.yuanTable[0].name.push(0) |
||||
}else if(element==4){ |
||||
this.yuanColumns.push('其他') |
||||
this.yuanTable[0].name.push(0) |
||||
}else if(element==16){ |
||||
this.yuanColumns.push('文本') |
||||
this.yuanTable[0].name.push(0) |
||||
} |
||||
}); |
||||
} |
||||
|
||||
data.forEach((element,i,value) => { |
||||
if(i==0){ |
||||
this.yuanTable[0].name[0]=value[0].orgName |
||||
this.yuanTable[0].name[1]=value[0].planStatistics.totalCount |
||||
}else{ |
||||
this.yuanTable.push({name:[value[i].orgName,value[i].planStatistics.totalCount]}) |
||||
} |
||||
}); |
||||
this.yuanTable.forEach((element,i,value)=>{ |
||||
if(i>0){ |
||||
for(let a=value[i].name.length;a<value[0].name.length;a++){ |
||||
value[i].name.push(0) |
||||
} |
||||
} |
||||
}) |
||||
this.yuanTable.forEach((yuan,yuani,yuanval)=>{ |
||||
this.yuanColumns.forEach((th,thi,thvalu)=>{ |
||||
data.forEach((element,i,value) => { |
||||
//预案级别数据
|
||||
if(value[i].planStatistics.planCategoryStatistics!=null){ |
||||
value[i].planStatistics.planCategoryStatistics.planCategories.forEach((jibie,ji,jval) => { |
||||
if(thvalu[thi].indexOf(jval[ji].planCategoryName)!=-1&&yuani==i){ |
||||
yuanval[yuani].name[thi]=jval[ji].count |
||||
} |
||||
}); |
||||
} |
||||
if(value[i].planStatistics.planTypeStatistics!=null){ |
||||
//预案类型数据
|
||||
value[i].planStatistics.planTypeStatistics.planTypes.forEach((planlx,lxi,lxval) => { |
||||
if(thvalu[thi].indexOf(lxval[lxi].planTypeName)!=-1&&yuani==i){ |
||||
yuanval[yuani].name[thi]=lxval[lxi].count |
||||
} |
||||
}); |
||||
} |
||||
|
||||
}); |
||||
}) |
||||
|
||||
}) |
||||
} |
||||
} |
||||
//this.tabledataSource=data
|
||||
|
||||
console.log(this.yuanColumns) |
||||
console.log(this.yuanTable) |
||||
|
||||
resolve(this.excelData) |
||||
} |
||||
) |
||||
}) |
||||
|
||||
} |
||||
|
||||
colorRgb(sColor) { |
||||
var reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/; |
||||
var sColor = sColor.toLowerCase(); |
||||
if (sColor && reg.test(sColor)) { |
||||
if (sColor.length === 4) { |
||||
var sColorNew = "#"; |
||||
for (var i = 1; i < 4; i += 1) { |
||||
sColorNew += sColor.slice(i, i + 1).concat(sColor.slice(i, i + 1)); |
||||
} |
||||
sColor = sColorNew; |
||||
} |
||||
//处理六位的颜色值
|
||||
var sColorChange = []; |
||||
for (var i = 1; i < 7; i += 2) { |
||||
sColorChange.push(parseInt("0x" + sColor.slice(i, i + 2))); |
||||
} |
||||
return sColorChange; |
||||
} else { |
||||
return sColor; |
||||
} |
||||
} |
||||
colorHex(rgb) { |
||||
var _this = rgb; |
||||
var reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/; |
||||
if (/^(rgb|RGB)/.test(_this)) { |
||||
var aColor = _this.replace(/(?:(|)|rgb|RGB)*/g, "").split(","); |
||||
var strHex = "#"; |
||||
for (var i = 0; i < aColor.length; i++) { |
||||
var hex: any = Number(aColor[i]).toString(16); |
||||
hex = hex < 10 ? 0 + '' + hex : hex;// 保证每个rgb的值为2位
|
||||
if (hex === "0") { |
||||
hex += hex; |
||||
} |
||||
strHex += hex; |
||||
} |
||||
if (strHex.length !== 7) { |
||||
strHex = _this; |
||||
} |
||||
return strHex; |
||||
} else if (reg.test(_this)) { |
||||
var aNum = _this.replace(/#/, "").split(""); |
||||
if (aNum.length === 6) { |
||||
return _this; |
||||
} else if (aNum.length === 3) { |
||||
var numHex = "#"; |
||||
for (var i = 0; i < aNum.length; i += 1) { |
||||
numHex += (aNum[i] + aNum[i]); |
||||
} |
||||
return numHex; |
||||
} |
||||
} else { |
||||
return _this; |
||||
} |
||||
} |
||||
|
||||
gradientColor(startColor, endColor, step) { |
||||
let _this = this |
||||
let startRGB = _this.colorRgb(startColor);//转换为rgb数组模式
|
||||
let startR = startRGB[0]; |
||||
let startG = startRGB[1]; |
||||
let startB = startRGB[2]; |
||||
|
||||
let endRGB = _this.colorRgb(endColor); |
||||
let endR = endRGB[0]; |
||||
let endG = endRGB[1]; |
||||
let endB = endRGB[2]; |
||||
|
||||
let sR = (endR - startR) / step;//总差值
|
||||
let sG = (endG - startG) / step; |
||||
let sB = (endB - startB) / step; |
||||
|
||||
var colorArr = []; |
||||
for (var i = 0; i < step; i++) { |
||||
//计算每一步的hex值
|
||||
var hex = _this.colorHex('rgb(' + parseInt((sR * i + startR)) + ',' + parseInt((sG * i + startG)) + ',' + parseInt((sB * i + startB)) + ')'); |
||||
colorArr.push(hex); |
||||
} |
||||
return colorArr; |
||||
} |
||||
integrity(width) { |
||||
let _this = this |
||||
|
||||
let style: any = {} |
||||
style.width = width + '%'; |
||||
if (width < 30) { |
||||
let colorArr = this.gradientColor('#D50000', '#E53935', 30); |
||||
for (let i = 0; i < 30; i++) { |
||||
if (i == width) { |
||||
style.background = colorArr[i] |
||||
} |
||||
} |
||||
} |
||||
if (width >= 30 && width < 60) { |
||||
let colorArr = this.gradientColor('#FF9800', '#E65100', 30); |
||||
for (let i = 30; i < 60; i++) { |
||||
if (i == width) { |
||||
style.background = colorArr[i - 30] |
||||
} |
||||
} |
||||
} |
||||
if (width >= 60) { |
||||
let colorArr = this.gradientColor('#81C784', '#2E7D32', 41); |
||||
for (let i = 60; i <= 100; i++) { |
||||
if (i == width) { |
||||
style.background = colorArr[i - 60] |
||||
} |
||||
} |
||||
} |
||||
return style |
||||
} |
||||
integrityDetails(width, zong) { |
||||
let style: any = {} |
||||
style.width = (width / zong) * 100 + '%'; |
||||
return style |
||||
} |
||||
|
||||
|
||||
|
||||
//得到当前单位信息
|
||||
getunitdata() { |
||||
this.http.get("/api/Account/Profiles").subscribe( |
||||
(data: any) => { |
||||
this.organizationName = data.organizationName |
||||
} |
||||
) |
||||
} |
||||
dwaddtime//单位查询开始时间
|
||||
dwendtime//单位结束时间
|
||||
yuanaddtime//预案查询开始时间
|
||||
yuanendtime//预案查询结束时间
|
||||
integrityScoreMin//完整度最小值
|
||||
integrityScoreMax//完整度最大值
|
||||
organizationName: any //当前单位组织机构名称
|
||||
treedata: any //组织机构树型数据
|
||||
newArr: any = [] |
||||
newallorganizations: any //用于存储在原始数据基础上的每个机构增加children字段
|
||||
//得到当前单位所在组织机构的tree型数据
|
||||
getpresentOrganization() { |
||||
this.newallorganizations = this.allorganizations |
||||
this.newallorganizations.forEach(item => { |
||||
item.children = [] |
||||
this.newallorganizations.forEach(element => { |
||||
if (element.parentId == item.id) { |
||||
item.children.push(element) |
||||
} |
||||
}); |
||||
}); |
||||
this.http.get("/api/Account/Profiles").subscribe( |
||||
(data: any) => { |
||||
this.organizationName = data.organizationName |
||||
if (this.organizationName) { |
||||
this.newallorganizations.forEach(item => { |
||||
if (item.name == this.organizationName) { |
||||
this.dataSource.data = [item] |
||||
} |
||||
}); |
||||
} else { |
||||
this.dataSource.data = this.tree.toTree(this.treedata); |
||||
} |
||||
} |
||||
) |
||||
|
||||
} |
||||
//获得所有组织机构
|
||||
getOrganizations() { |
||||
this.http.get('/api/Organizations').subscribe( |
||||
(data: any) => { |
||||
this.allorganizations = data |
||||
this.treedata = this.tree.toTree(data); |
||||
this.getpresentOrganization(); |
||||
} |
||||
) |
||||
} |
||||
|
||||
//获得所有单位类型
|
||||
getUnittype() { |
||||
this.http.get('/api/BuildingTypes/Simple').subscribe( |
||||
data => { |
||||
this.allunittype = data |
||||
} |
||||
) |
||||
} |
||||
//辖区中队div是否显示
|
||||
isorganizationbox: boolean = false |
||||
//点击辖区中队树，将选择的辖区中队添加到变量
|
||||
add(node) { |
||||
this.isorganizationbox = false |
||||
if(this.preparelevels==0){ |
||||
this.js = node.name |
||||
this.jsId = node.id |
||||
}else if(this.preparelevels==1){ |
||||
this.yuanjs=node.name |
||||
this.yuanjsId=node.id |
||||
} |
||||
|
||||
} |
||||
//关闭辖区中队隐藏框
|
||||
closeorganizationbox() { |
||||
this.isorganizationbox = false |
||||
} |
||||
//打开辖区中队隐藏框
|
||||
openorganizationbox() { |
||||
this.isorganizationbox = true |
||||
} |
||||
//关闭出现的组织机构div
|
||||
closediv() { |
||||
this.isorganizationbox = false |
||||
} |
||||
//查询
|
||||
onSubmit(e) { |
||||
let config = new MatSnackBarConfig(); |
||||
config.verticalPosition = 'top'; |
||||
config.duration = 3000 |
||||
if(this.dwendtime<this.dwaddtime||this.yuanaddtime>this.yuanendtime){ |
||||
this.snackBar.open('开始时间不能早于结束时间', '确定', config); |
||||
} |
||||
this.getAllPlanInfo(); |
||||
} |
||||
companyName: any //单位名称
|
||||
js: any //单位所选组织机构
|
||||
jsId: any //单位所选组织机构的id
|
||||
jscheck: boolean //单位所选组织机构勾选框
|
||||
yuanjs: any //预案所选组织机构
|
||||
yuanjsId: any //预案所选组织机构的id
|
||||
yuanjscheck: boolean //预案所选组织机构勾选框
|
||||
unittype=[] //单位类型
|
||||
reservePlanType=[] //预案类型
|
||||
preparelevel=[1] //单位状态
|
||||
plcheck: boolean //编制级别勾选框
|
||||
planCategory=[] //预案级别
|
||||
integritySort=1 //单位排序字段
|
||||
yuanintegritySort=1 //预案排序字段
|
||||
//重置
|
||||
reset() { |
||||
if(this.preparelevels==0){ |
||||
this.js = '' |
||||
this.jsId = '' |
||||
this.jscheck = false |
||||
this.unittype = [] |
||||
this.preparelevel = [0] |
||||
this.dwaddtime = '' |
||||
this.dwendtime = '' |
||||
}else if(this.preparelevels==1){ |
||||
this.yuanaddtime='' |
||||
this.yuanendtime='' |
||||
this.yuanjs='' |
||||
this.yuanjsId='' |
||||
this.yuanjscheck=false |
||||
this.reservePlanType = [] |
||||
this.planCategory = [] |
||||
} |
||||
|
||||
//重新获取初始化列表
|
||||
this.getAllPlanInfo(); |
||||
} |
||||
exal(){ |
||||
var uri = 'data:application/vnd.ms-excel;base64,', |
||||
|
||||
template = '<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40"><head><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head><body><table>{table}</table></body></html>', |
||||
|
||||
base64 = function(s) { |
||||
|
||||
return window.btoa(unescape(encodeURIComponent(s))) |
||||
|
||||
}, |
||||
|
||||
format = function(s, c) { |
||||
|
||||
return s.replace(/{(\w+)}/g, function(m, p) { |
||||
|
||||
return c[p]; |
||||
|
||||
}) |
||||
|
||||
} |
||||
|
||||
return function(table, name) { |
||||
|
||||
if (!table.nodeType) table = document.getElementById(table); |
||||
|
||||
var ctx = { |
||||
|
||||
worksheet: name || 'Worksheet', |
||||
|
||||
table: table.innerHTML |
||||
|
||||
}; |
||||
|
||||
window.location.href = uri + base64(format(template, ctx)); |
||||
|
||||
} |
||||
} |
||||
|
||||
export(){ |
||||
const httpOptions = { |
||||
responseType: 'blob' as 'json' |
||||
}; |
||||
this.http.post(`/api/StatisticsAnalysis/Excel?queryMode=${this.preparelevels}`,this.excelData,httpOptions).subscribe((data:any) => { |
||||
// // 文件名中有中文 则对文件名进行转码
|
||||
const link = document.createElement('a'); |
||||
const blob = new Blob([data], {type: 'application/vnd.ms-excel'}); |
||||
link.setAttribute('href', window.URL.createObjectURL(blob)); |
||||
link.setAttribute('download', '报表统计'+'.xls'); |
||||
link.style.visibility = 'hidden'; |
||||
document.body.appendChild(link); |
||||
link.click(); |
||||
document.body.removeChild(link); |
||||
}) |
||||
} |
||||
|
||||
|
||||
|
||||
} |
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,34 @@
|
||||
<div class="box"> |
||||
<div class="top"> |
||||
<span style="font-size: 20px;">修改内容</span> |
||||
</div> |
||||
<div class="queryField"> |
||||
<label style="margin-right: 10px;">名称:</label> |
||||
<!-- <mat-form-field class="example-full-width"> |
||||
<input matInput placeholder="请输入表头名称" [(ngModel)]="headName" autocomplete="off" readonly> |
||||
</mat-form-field> --> |
||||
<span>{{headName}}</span> |
||||
</div> |
||||
<div class="queryField" *ngIf="level==1||level==undefined"> |
||||
<label style="margin-right: 10px;">列数:</label> |
||||
<mat-form-field class="example-full-width"> |
||||
<input matInput type="number" [(ngModel)]="data.tableth.length" autocomplete="off" required min="0" required> |
||||
</mat-form-field> |
||||
</div> |
||||
<div class="queryField" *ngIf="level==2"> |
||||
<label style="margin-right: 10px;">列数:</label> |
||||
<mat-form-field class="example-full-width"> |
||||
<input matInput type="number" [(ngModel)]="data.tableth[0].length" autocomplete="off" required min="1" required> |
||||
</mat-form-field> |
||||
</div> |
||||
<div class="queryField" *ngIf="level==2"> |
||||
<label style="margin-right: 10px;">行数:</label> |
||||
<mat-form-field class="example-full-width"> |
||||
<input matInput type="number" [(ngModel)]="data.tableth.length" autocomplete="off" required min="1" required> |
||||
</mat-form-field> |
||||
</div> |
||||
<div class="bottom"> |
||||
<button mat-raised-button color="primary" (click)='newdisaster()'>确定</button> |
||||
<button mat-raised-button style="margin-left: 50px;" (click)='close()'>取消</button> |
||||
</div> |
||||
</div> |
||||
@ -0,0 +1,17 @@
|
||||
<div class="box"> |
||||
<div class="top"> |
||||
<span>自定义新增</span> |
||||
</div> |
||||
<div class="center"> |
||||
<div class="group" > |
||||
<label style="margin-right: 10px;">自定义名称:</label> |
||||
<mat-form-field class="example-full-width"> |
||||
<input matInput placeholder="请输入自定义名称" autocomplete="off" [(ngModel)]="groupName" required> |
||||
</mat-form-field> |
||||
</div> |
||||
</div> |
||||
<div class="bottom"> |
||||
<button mat-raised-button color="primary" (click)='newGroup()' style="margin-left: 50px;">确定</button> |
||||
<button mat-raised-button style="margin-left: 20px;" (click)="close()">取消</button> |
||||
</div> |
||||
</div> |
||||
|
After Width: | Height: | Size: 447 B |
|
After Width: | Height: | Size: 328 B |
|
After Width: | Height: | Size: 339 B |
|
After Width: | Height: | Size: 342 B |
|
After Width: | Height: | Size: 298 B |
|
After Width: | Height: | Size: 328 B |
Loading…
Reference in new issue