From a5a0830f291cb8865baf1f0c84007d755a66e51a Mon Sep 17 00:00:00 2001 From: chenjingyu <1148019379@qq.com> Date: Tue, 26 Oct 2021 16:47:31 +0800 Subject: [PATCH] =?UTF-8?q?[=E6=96=B0=E5=A2=9E]=E6=8A=A5=E8=A1=A8=E7=BB=9F?= =?UTF-8?q?=E8=AE=A1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../combined-query.component.html | 164 +++++++++ .../combined-query.component.scss | 233 +++++++++++++ .../combined-query.component.spec.ts | 25 ++ .../combined-query.component.ts | 317 ++++++++++++++++++ .../statistic-analysis-routing.module.ts | 4 +- .../statistic-analysis.module.ts | 5 +- 6 files changed, 745 insertions(+), 3 deletions(-) create mode 100644 src/app/statistic-analysis/combined-query/combined-query.component.html create mode 100644 src/app/statistic-analysis/combined-query/combined-query.component.scss create mode 100644 src/app/statistic-analysis/combined-query/combined-query.component.spec.ts create mode 100644 src/app/statistic-analysis/combined-query/combined-query.component.ts diff --git a/src/app/statistic-analysis/combined-query/combined-query.component.html b/src/app/statistic-analysis/combined-query/combined-query.component.html new file mode 100644 index 0000000..8560622 --- /dev/null +++ b/src/app/statistic-analysis/combined-query/combined-query.component.html @@ -0,0 +1,164 @@ + +
+
+
+
+
+ 单位 + 预案 +
+
+ + + + + 包含下级 +
+
+ clear +
+ + + +
  • {{node.name}}
    • +     + + +
  • {{node.name}}
    • +     +     +
    +
    +
    + + + + + + 🠊 + + + +
    +
    + + + + 文本预案 + 二维预案 + 三维预案 + 其他预案 + + + +
    +
    + + + + + {{unit.name}} + + + +
    + +
    + + + + 新增 + 维护更新 + + +
    + +
    + + + + 应急预案(国家级) + 应急预案(市级) + 类型预案 + Ⅰ级预案 + Ⅱ级预案 + Ⅲ级预案 + Ⅳ级预案 + Ⅴ级预案 + + +
    + + +
    + + +
    +
    + +
    +
    + +
    +
    + + + + + + + + + + + + + + + + + + + +
    组织名称{{element.name}}单位类型{{element.creatorName}}预案级别{{element.planCategory==1?'Ⅰ级预案':element.planCategory==2?'Ⅱ级预案': + element.planCategory==3?'Ⅲ级预案':element.planCategory==4?'Ⅳ级预案':element.planCategory==5?'Ⅴ级预案':element.planCategory==8?'类型预案':'应急预案'}} +
    + +
    +
    +
    diff --git a/src/app/statistic-analysis/combined-query/combined-query.component.scss b/src/app/statistic-analysis/combined-query/combined-query.component.scss new file mode 100644 index 0000000..6b834aa --- /dev/null +++ b/src/app/statistic-analysis/combined-query/combined-query.component.scss @@ -0,0 +1,233 @@ +.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{ + .buttonbox{ + padding-left: 50px; + button{ + margin:0 10px + } + } + .tablebox{ + table{ + width: 100%; + // margin-left: 2%; + margin-top: 15px; + } + 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; + } +} \ No newline at end of file diff --git a/src/app/statistic-analysis/combined-query/combined-query.component.spec.ts b/src/app/statistic-analysis/combined-query/combined-query.component.spec.ts new file mode 100644 index 0000000..9b36c52 --- /dev/null +++ b/src/app/statistic-analysis/combined-query/combined-query.component.spec.ts @@ -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; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ CombinedQueryComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(CombinedQueryComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/statistic-analysis/combined-query/combined-query.component.ts b/src/app/statistic-analysis/combined-query/combined-query.component.ts new file mode 100644 index 0000000..64c28e4 --- /dev/null +++ b/src/app/statistic-analysis/combined-query/combined-query.component.ts @@ -0,0 +1,317 @@ +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'; + +@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(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[] = ['planname', 'addpeople', 'level'];//, 'addtime', 'plantype', 'auditStatus', 'openRange', 'projectlevel', 'operation' + allorganizations: any //所有组织机构 + allunittype: any //所有单位类型 + tabledataSource: any //表格数据 + url + findTj=0//查询条件 + + preparelevels: any + 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 //存储所有预案信息 + //获得所有预案信息 + getAllPlanInfo() { + + } + + 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 + } + ) + } + addtime//开始时间 + endtime//结束时间 + 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 + this.js = node.name + this.jsId = node.id + } + //关闭辖区中队隐藏框 + closeorganizationbox() { + this.isorganizationbox = false + } + //打开辖区中队隐藏框 + openorganizationbox() { + this.isorganizationbox = true + } + //关闭出现的组织机构div + closediv() { + this.isorganizationbox = false + } + //查询 + onSubmit(e) { + this.getAllPlanInfo(); + } + companyName: any //单位名称 + js: any //所选组织机构 + jsId: any //所选组织机构的id + jscheck: boolean //所选组织机构勾选框 + unittype: any //单位类型 + reservePlanType: any //预案类型 + preparelevel: any //编制级别 + plcheck: boolean //编制级别勾选框 + planCategory = []//预案级别 + //重置 + reset() { + this.companyName = '' + this.js = '' + this.jsId = '' + this.jscheck = false + this.unittype = '' + this.reservePlanType = '' + this.preparelevel = '' + this.addtime = '' + this.endtime = '' + this.plcheck = false + //重新获取初始化列表 + this.planCategory = [] + this.getAllPlanInfo(); + } +} diff --git a/src/app/statistic-analysis/statistic-analysis-routing.module.ts b/src/app/statistic-analysis/statistic-analysis-routing.module.ts index 1720cad..b3dd69c 100644 --- a/src/app/statistic-analysis/statistic-analysis-routing.module.ts +++ b/src/app/statistic-analysis/statistic-analysis-routing.module.ts @@ -37,6 +37,7 @@ import { CompangInfoComponent } from './compang-info/compang-info.component' import { AllPlanComponent } from './all-plan/all-plan.component' import { PlanAnalysisBySynthesisComponent } from './plan-analysis-by-synthesis/plan-analysis-by-synthesis.component'; import { RealMonitoringComponent } from './real-monitoring/real-monitoring.component' +import { CombinedQueryComponent } from './combined-query/combined-query.component' const routes: Routes = [ { path: 'statePageOne', component: PageOneComponent }, @@ -71,7 +72,8 @@ const routes: Routes = [ { path: 'CompangInfo', component: CompangInfoComponent }, { path: 'AllPlan', component: AllPlanComponent }, { path: 'PlanAnalysisBySynthesis', component: PlanAnalysisBySynthesisComponent }, - { path: 'RealMonitoring', component: RealMonitoringComponent } + { path: 'RealMonitoring', component: RealMonitoringComponent }, + { path :'CombinedQuery',component:CombinedQueryComponent} ]; @NgModule({ diff --git a/src/app/statistic-analysis/statistic-analysis.module.ts b/src/app/statistic-analysis/statistic-analysis.module.ts index fc7d228..f8a1607 100644 --- a/src/app/statistic-analysis/statistic-analysis.module.ts +++ b/src/app/statistic-analysis/statistic-analysis.module.ts @@ -74,7 +74,8 @@ import { PsViewer }from './all-plan/all-plan.component'; import { GkPsViewer2, PlanAnalysisBySynthesisComponent } from './plan-analysis-by-synthesis/plan-analysis-by-synthesis.component' import { PlanManagementModule } from '../plan-management/plan-management.module'; import { RealMonitoringComponent } from './real-monitoring/real-monitoring.component'; -import { lookunit }from './all-plan/all-plan.component' +import { lookunit }from './all-plan/all-plan.component'; +import { CombinedQueryComponent } from './combined-query/combined-query.component' @NgModule({ declarations: [GkPsViewer2,PageOneComponent, PageTwoTimeComponent, PageTwoNameComponent, PageZhongDuiDetailsComponent, @@ -84,7 +85,7 @@ import { lookunit }from './all-plan/all-plan.component' BuildingTypeTwoReverseComponent, BuildingTypeThreeDetailsComponent, AddUnitOneComponent, AddUnitTwoTypeStatisticsComponent, AddUnitTwoTypeDetailsComponent, AddUnitTwoTimeComponent,AddUnitThreeLineDetailsComponent,AddUnitThreeBarDetailsComponent, HomeComponent, DeleteThereLineDetailsComponent, PageThereComponent, PageThereYearComponent, DeleteTwoNewaddComponent, - CompangInfoComponent, AllPlanComponent,PsViewer, RealMonitoringComponent,PlanAnalysisBySynthesisComponent,lookunit], + CompangInfoComponent, AllPlanComponent,PsViewer, RealMonitoringComponent,PlanAnalysisBySynthesisComponent,lookunit, CombinedQueryComponent], imports: [ CommonModule, StatisticAnalysisRoutingModule,