diff --git a/src/app/statistic-analysis/addUnit/add-unit-one/add-unit-one.component.ts b/src/app/statistic-analysis/addUnit/add-unit-one/add-unit-one.component.ts index 70a4136..39b8b2b 100644 --- a/src/app/statistic-analysis/addUnit/add-unit-one/add-unit-one.component.ts +++ b/src/app/statistic-analysis/addUnit/add-unit-one/add-unit-one.component.ts @@ -13,8 +13,15 @@ export class AddUnitOneComponent implements OnInit { setTimeoutObj//延时器需要清除 tabledata + padHw ngOnInit(): void { + if(window.matchMedia("(max-width: 1400px)").matches){ + this.padHw=true + //this.padjt= + }else{ + this.padHw=false + } if(sessionStorage.getItem('refresh') === 'true') { sessionStorage.removeItem('refresh'); location.reload(); @@ -67,11 +74,11 @@ export class AddUnitOneComponent implements OnInit { } for(var i=0;i0){ - - } */ - + if(this.tabledata[0].organizationStatistics.organizations[i].organizationName.length>5&&this.padHw){ + this.tabledata[0].organizationStatistics.organizations[i].organizationName=this.tabledata[0].organizationStatistics.organizations[i].organizationName.slice(0, 5) + +'\n'+this.tabledata[0].organizationStatistics.organizations[i].organizationName.slice(5) + } + this.lengthOrData.push(this.tabledata[0].organizationStatistics.organizations[i].organizationName) } this.buildData=this.buildData.map(v=>{return {name: v.buildingTypeName,value:v.count,id:v.buildingTypeId}}) this.orData=this.orData.map(v=>{return {name: v.organizationName,value:v.count,id:v.organizationId}}) @@ -113,8 +120,8 @@ export class AddUnitOneComponent implements OnInit { { name: '访问来源', type: 'pie', - radius: '50%', - center: ['45%', '53%'], + radius:this.padHw?'42%':'50%', + center: ['48%', '53%'], bottom:130, left:30, label:{ diff --git a/src/app/statistic-analysis/addUnit/add-unit-three-bar-details/add-unit-three-bar-details.component.scss b/src/app/statistic-analysis/addUnit/add-unit-three-bar-details/add-unit-three-bar-details.component.scss index fdf24f1..5ab7618 100644 --- a/src/app/statistic-analysis/addUnit/add-unit-three-bar-details/add-unit-three-bar-details.component.scss +++ b/src/app/statistic-analysis/addUnit/add-unit-three-bar-details/add-unit-three-bar-details.component.scss @@ -67,10 +67,16 @@ overflow: auto; #barEchart{ width: 100%; - height: 550px; + @media screen and (max-device-width:1400px){ + height: 500px; + top: 55%; + } + @media screen and (min-device-width:1400px){ + height: 550px; + top: 50%; + } position: absolute; left: 50%; - top: 50%; transform: translate(-50%,-50%); } } \ No newline at end of file diff --git a/src/app/statistic-analysis/addUnit/add-unit-two-type-details/add-unit-two-type-details.component.scss b/src/app/statistic-analysis/addUnit/add-unit-two-type-details/add-unit-two-type-details.component.scss index b6bb35f..098bbbd 100644 --- a/src/app/statistic-analysis/addUnit/add-unit-two-type-details/add-unit-two-type-details.component.scss +++ b/src/app/statistic-analysis/addUnit/add-unit-two-type-details/add-unit-two-type-details.component.scss @@ -31,11 +31,17 @@ overflow: auto; #barEchart{ width: 100%; - height: 550px; position: absolute; left: 50%; - top: 50%; transform: translate(-50%,-50%); + @media screen and (max-device-width:1400px){ + height: 500px; + top: 55%; + } + @media screen and (min-device-width:1400px){ + height: 550px; + top: 50%; + } } } } \ No newline at end of file diff --git a/src/app/statistic-analysis/addUnit/add-unit-two-type-details/add-unit-two-type-details.component.ts b/src/app/statistic-analysis/addUnit/add-unit-two-type-details/add-unit-two-type-details.component.ts index 8856154..3ccd214 100644 --- a/src/app/statistic-analysis/addUnit/add-unit-two-type-details/add-unit-two-type-details.component.ts +++ b/src/app/statistic-analysis/addUnit/add-unit-two-type-details/add-unit-two-type-details.component.ts @@ -34,7 +34,14 @@ export class AddUnitTwoTypeDetailsComponent implements OnInit { tabledata thisorId=[] zhiorbuild + padHw ngOnInit(): void { + if(window.matchMedia("(max-width: 1400px)").matches){ + this.padHw=true + //this.padjt= + }else{ + this.padHw=false + } if(sessionStorage.getItem('refresh') === 'true') { sessionStorage.removeItem('refresh'); location.reload(); @@ -46,13 +53,18 @@ export class AddUnitTwoTypeDetailsComponent implements OnInit { this.canshuId=params['zhuId'] this.zhiorbuild=params['type'] }); + + this.setTimeoutObj = window.setTimeout(()=>{ + this.getechartsData() + }) + } + async getechartsData(){ let paramsdata:any = { //id:this.zhiorbuild=='zhi'? this.canshuId:this.lastId, organizationId:this.zhiorbuild=='zhi'?this.lastId:this.canshuId } - this.echartsData.getData(paramsdata,`/api/StatisticsAnalysis/Companies/BuildingTypes/${this.zhiorbuild=='zhi'?this.canshuId:this.lastId}`) - this.setTimeoutObj = window.setTimeout(()=>{ - this.tabledata=JSON.parse(JSON.stringify(this.echartsData.allDate)) + await this.echartsData.getData(paramsdata,`/api/StatisticsAnalysis/Companies/BuildingTypes/${this.zhiorbuild=='zhi'?this.canshuId:this.lastId}`) + this.tabledata=JSON.parse(JSON.stringify(this.echartsData.allDate)) //console.log(this.tabledata) for(var i=0;i 1)//如果类目项的文字大于3, + { + for (var i = 0; i < rowN; i++) { + var temp = "";//每次截取的字符串 + var start = i * maxLength;//开始截取的位置 + var end = start + maxLength;//结束截取的位置 + //这里也可以加一个是否是最后一行的判断,但是不加也没有影响,那就不加吧 + temp = value.substring(start, end) + "\n"; + ret += temp; //凭借最终的字符串 + } + return ret; + } + else { + return value; + } + } + } + asixLable={ + interval: 0, + textStyle:{ + fontSize :18, + color:'#000000' + }, + formatter:function(value) + { + var ret = "";//拼接加\n返回的类目项 + var maxLength =4;//每项显示文字个数 + var valLength = value.length;//X轴类目项的文字个数 + var rowN = Math.ceil(valLength / maxLength); //类目项需要换行的行数 + if (rowN > 1)//如果类目项的文字大于3, + { + for (var i = 0; i < rowN; i++) { + var temp = "";//每次截取的字符串 + var start = i * maxLength;//开始截取的位置 + var end = start + maxLength;//结束截取的位置 + //这里也可以加一个是否是最后一行的判断,但是不加也没有影响,那就不加吧 + temp = value.substring(start, end) + "\n"; + ret += temp; //凭借最终的字符串 + } + return ret; + } + else { + return value; + } + } + } barEcharts(){ this.forArr.forEach(item=>{ @@ -314,22 +379,15 @@ export class AddUnitTwoTypeStatisticsComponent implements OnInit { } }, grid: { - top: 90, + containLabel:true, + top:this.padHw?60:90, bottom: 30 }, xAxis: { id:this.zhiorbuild=="zhi"?this.buildingTypeId:this.organizationId, type: 'category', data:this.zhiorbuild=="zhi"?this.buildingData: this.zhiNameData, - axisLabel:{ - //this.axisLabel, - interval: 0, - textStyle:{ - fontSize :18, - color:'#000000' - } - - } + axisLabel:this.padHw?this.asixLablehw:this.asixLable, }, yAxis: { type: 'value', diff --git a/src/app/statistic-analysis/all-plan/all-plan.component.scss b/src/app/statistic-analysis/all-plan/all-plan.component.scss index 01512e9..3900afd 100644 --- a/src/app/statistic-analysis/all-plan/all-plan.component.scss +++ b/src/app/statistic-analysis/all-plan/all-plan.component.scss @@ -1,4 +1,6 @@ .body{ + height: 100%; + overflow-y: auto; display: flex; flex-direction: column; .topbox{ diff --git a/src/app/statistic-analysis/buildingType/building-type-one/building-type-one.component.ts b/src/app/statistic-analysis/buildingType/building-type-one/building-type-one.component.ts index e7cabae..4b321f8 100644 --- a/src/app/statistic-analysis/buildingType/building-type-one/building-type-one.component.ts +++ b/src/app/statistic-analysis/buildingType/building-type-one/building-type-one.component.ts @@ -14,7 +14,7 @@ export class BuildingTypeOneComponent implements OnInit { constructor(private http:HttpClient,private router: Router,public echartsData:EchartsDataService) { } ngOnInit(): void { - if(window.matchMedia("(max-width: 1300px)").matches&&window.matchMedia("(max-height: 700px)").matches){ + if(window.matchMedia("(max-width: 1400px)").matches){ this.padHw=true //this.padjt= }else{ @@ -75,7 +75,8 @@ export class BuildingTypeOneComponent implements OnInit { }, legend: { orient: 'vertical', - right: this.padHw?150:250, + //left:this.padHw?50:0, + right:this.padHw?20:250, top:60, textStyle:{ fontSize:18, diff --git a/src/app/statistic-analysis/buildingType/building-type-three-details/building-type-three-details.component.scss b/src/app/statistic-analysis/buildingType/building-type-three-details/building-type-three-details.component.scss index 890c20d..34e1992 100644 --- a/src/app/statistic-analysis/buildingType/building-type-three-details/building-type-three-details.component.scss +++ b/src/app/statistic-analysis/buildingType/building-type-three-details/building-type-three-details.component.scss @@ -30,10 +30,18 @@ overflow: auto; #barEchart{ width: 100%; - height: 550px; + + @media screen and (max-device-width:1400px){ + top: 60%; + height: 500px; + } + @media screen and (min-device-width:1400px){ + top: 50%; + height: 550px; + } position: absolute; left: 50%; - top: 50%; + transform: translate(-50%,-50%); } } diff --git a/src/app/statistic-analysis/buildingType/building-type-three-details/building-type-three-details.component.ts b/src/app/statistic-analysis/buildingType/building-type-three-details/building-type-three-details.component.ts index b569594..d310e3c 100644 --- a/src/app/statistic-analysis/buildingType/building-type-three-details/building-type-three-details.component.ts +++ b/src/app/statistic-analysis/buildingType/building-type-three-details/building-type-three-details.component.ts @@ -33,7 +33,7 @@ export class BuildingTypeThreeDetailsComponent implements OnInit { padHw ngOnInit(): void { - if(window.matchMedia("(max-width: 1300px)").matches&&window.matchMedia("(max-height: 700px)").matches){ + if(window.matchMedia("(max-width: 1300px)").matches){ this.padHw=true //this.padjt= }else{ @@ -95,7 +95,7 @@ export class BuildingTypeThreeDetailsComponent implements OnInit { this.detailPlanEchart = echarts.init(document.getElementById('barEchart'),'walden'); var option = { title: { - top:this.padHw?50:0, + top:this.padHw?10:0, text: this.buildingTypeName + '(' +this.organizationName + ')'+`:总数(${this.tabledata[0].totalCount})`, left: "center", textStyle: { @@ -103,7 +103,7 @@ export class BuildingTypeThreeDetailsComponent implements OnInit { } }, grid: { - top:this.padHw?180:110, + top:this.padHw?120:110, //bottom: 10 }, xAxis: { diff --git a/src/app/statistic-analysis/echarts-data.service.ts b/src/app/statistic-analysis/echarts-data.service.ts index 22a351e..cd98dbf 100644 --- a/src/app/statistic-analysis/echarts-data.service.ts +++ b/src/app/statistic-analysis/echarts-data.service.ts @@ -568,7 +568,7 @@ export class EchartsDataService { this.res+='总计'+countall+''+allCountbi.toFixed(2)+'%' this.res+='' return this.res - },1000) + }) } diff --git a/src/app/statistic-analysis/state/page-one/page-one.component.ts b/src/app/statistic-analysis/state/page-one/page-one.component.ts index 779b1f1..c8788bb 100644 --- a/src/app/statistic-analysis/state/page-one/page-one.component.ts +++ b/src/app/statistic-analysis/state/page-one/page-one.component.ts @@ -4,7 +4,7 @@ * @Author: sueRimn * @Date: 2020-09-01 15:24:39 * @LastEditors: sueRimn - * @LastEditTime: 2021-03-25 11:17:04 + * @LastEditTime: 2021-04-01 09:46:00 */ import { Component, OnInit } from '@angular/core'; import { Router } from '@angular/router'; @@ -22,21 +22,31 @@ export class PageOneComponent implements OnInit { constructor(private router: Router,public echartsData:EchartsDataService) { } + padHw ngOnInit() { + if(window.matchMedia("(max-width: 1400px)").matches){ + this.padHw=true + //this.padjt= + }else{ + this.padHw=false + } if(sessionStorage.getItem('refresh') === 'true') { sessionStorage.removeItem('refresh'); location.reload(); } - this.echartsData.getData(null,`/api/StatisticsAnalysis/Plans`) + window.setTimeout(()=>{ - this.initCharts() - },1000) + this.getechartsdata() + }) } ngOnDestroy(): void { this.indexBzt.clear() this.indexBzt.dispose() } - /* 饼状图跳转 */ + async getechartsdata(){ + await this.echartsData.getData(null,`/api/StatisticsAnalysis/Plans`) + this.initCharts() + } /* 首页饼状图 */ indexBzt @@ -67,8 +77,8 @@ export class PageOneComponent implements OnInit { }, legend: { orient: 'vertical', - right: 150, - top:80, + right:this.padHw?50:150, + top:this.padHw?30:80, //padding:20, // itemWidth:60, // itemHeight:25, diff --git a/src/app/statistic-analysis/state/page-there/page-there.component.scss b/src/app/statistic-analysis/state/page-there/page-there.component.scss index fb3b6d7..90da0d8 100644 --- a/src/app/statistic-analysis/state/page-there/page-there.component.scss +++ b/src/app/statistic-analysis/state/page-there/page-there.component.scss @@ -12,7 +12,7 @@ } #Line{ width: 50%; - height: 420px; + height: 550px; margin: 50px auto; } } @@ -67,10 +67,17 @@ overflow: auto; #zhidui{ width: 100%; - height: 550px; + @media screen and (max-device-width:1400px){ + height: 550px; + top: 60%; + } + @media screen and (min-device-width:1400px){ + height: 650px; + top: 55%; + } position: absolute; left: 50%; - top: 50%; + transform: translate(-50%,-50%); } } \ No newline at end of file diff --git a/src/app/statistic-analysis/state/page-there/page-there.component.ts b/src/app/statistic-analysis/state/page-there/page-there.component.ts index bd5122a..bd0d99c 100644 --- a/src/app/statistic-analysis/state/page-there/page-there.component.ts +++ b/src/app/statistic-analysis/state/page-there/page-there.component.ts @@ -32,25 +32,38 @@ export class PageThereComponent implements OnInit { } ngOnInit(): void { + if(window.matchMedia("(max-width: 1400px)").matches){ + this.padHw=true + //this.padjt= + }else{ + this.padHw=false + } this.dateInit(); let datayuex:string; - let headName:string; this.activatedRoute.queryParams.subscribe(param=>{ this.lastid=param.id this.type=param.type this.headtext=param.headtext datayuex=param.level this.zhong=param.zhong - headName=datayuex+'月'+this.headtext; + this.headName=datayuex+'月'+this.headtext; //console.log(headName) }); + + window.setTimeout(()=>{ + this.getechartsdata() + }) + } + padHw + headName + selectType:string = 'month'; //选择当前的 查询类型 按月/年 + async getechartsdata(){ let paramdata={ planStatus:this.type, OrganizationId:this.lastid } - this.echartsData.getData(paramdata,`/api/StatisticsAnalysis/Plans/Status`) - window.setTimeout(()=>{ - this.tabledata=JSON.parse(JSON.stringify(this.echartsData.allDate)) + await this.echartsData.getData(paramdata,`/api/StatisticsAnalysis/Plans/Status`) + this.tabledata=JSON.parse(JSON.stringify(this.echartsData.allDate)) console.log(this.tabledata) for(var i=0;i { + this.getechartsdata() + }); + } + + ngOnDestroy(): void { + } + async getechartsdata(){ let paramdata={ planStatus:this.type } - this.data.getData(paramdata,`/api/StatisticsAnalysis/Plans/Status`) - setTimeout(() => { - this.tabledata=JSON.parse(JSON.stringify(this.data.allDate)) - console.log(this.tabledata) + await this.data.getData(paramdata,`/api/StatisticsAnalysis/Plans/Status`) + this.tabledata=JSON.parse(JSON.stringify(this.data.allDate)) + //console.log(this.tabledata) for(var i=0;i{ - this.tabledata=JSON.parse(JSON.stringify(this.data.allDate)) + this.getechartsdata() + }) + } + ngOnDestroy(): void { + this.detailPlanEchart.clear() + this.detailPlanEchart.dispose() + } + async getechartsdata(){ + let paramdata={ + planStatus:this.type, + OrganizationId:this.lastid + } + await this.data.getData(paramdata,`/api/StatisticsAnalysis/Plans/Status`) + this.tabledata=JSON.parse(JSON.stringify(this.data.allDate)) console.log(this.tabledata) for(var i=0;i