-
-
'
return res
}
@@ -131,7 +150,7 @@ export class EchartsDataService {
//用法：
-
+
// tooltip: {
// trigger: 'axis',
// backgroundColor:'rgba(255,255,255,1)',//通过设置rgba调节背景颜色与透明度
From ef33591de9919a6551922cf3b0f495586154a5a5 Mon Sep 17 00:00:00 2001
From: cpf <1105965053@qq.com>
Date: Fri, 4 Sep 2020 14:27:01 +0800
Subject: [PATCH 5/7] =?UTF-8?q?[=E5=AE=8C=E5=96=84]=20=E8=AE=A1=E5=88=92?=
=?UTF-8?q?=E6=9B=B4=E6=96=B0=E7=BB=9F=E8=AE=A1=20=E5=88=9D=E6=AD=A5?=
=?UTF-8?q?=E5=AE=8C=E6=88=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../echarts-data.service.ts | 7 +-
.../detailedInformation.html | 1 +
.../scheduled-updates/moreTable.html | 0
.../scheduled-updates/notVerified.html | 16 +
.../scheduled-updates/publicEcharts.html | 25 +
.../scheduled-updates.component.html | 4 +-
.../scheduled-updates.component.scss | 11 +
.../scheduled-updates.component.ts | 735 +++++++++++++++++-
.../scheduled-updates/verified.html | 16 +
.../page-two-time.component.scss | 11 +-
.../statistic-analysis-routing.module.ts | 5 +-
.../statistic-analysis.module.ts | 4 +-
12 files changed, 827 insertions(+), 8 deletions(-)
create mode 100644 src/app/statistic-analysis/scheduled-updates/detailedInformation.html
create mode 100644 src/app/statistic-analysis/scheduled-updates/moreTable.html
create mode 100644 src/app/statistic-analysis/scheduled-updates/notVerified.html
create mode 100644 src/app/statistic-analysis/scheduled-updates/publicEcharts.html
create mode 100644 src/app/statistic-analysis/scheduled-updates/verified.html
diff --git a/src/app/statistic-analysis/echarts-data.service.ts b/src/app/statistic-analysis/echarts-data.service.ts
index b6a0ca3..0fae52b 100644
--- a/src/app/statistic-analysis/echarts-data.service.ts
+++ b/src/app/statistic-analysis/echarts-data.service.ts
@@ -9,7 +9,12 @@ export class EchartsDataService {
//预案状态分析
statefulInspectionName:string;
- statefulInspectionToggle:boolean = true; // true=显示所有柱状图 flase=显示当前点击柱状图
+ statefulInspectionToggle:boolean = true; // true=显示当前点击柱状图 flase=显示当前点击折现图
+
+ //计划更新统计
+ scheduledUpdatesType:number = 0; //已核查/未核查
+ scheduledUpdatesName:string;
+ scheduledUpdatesToggle:boolean = true; // 显示 当前点击 已核查/未核查
diff --git a/src/app/statistic-analysis/scheduled-updates/detailedInformation.html b/src/app/statistic-analysis/scheduled-updates/detailedInformation.html
new file mode 100644
index 0000000..dd6dc6c
--- /dev/null
+++ b/src/app/statistic-analysis/scheduled-updates/detailedInformation.html
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/app/statistic-analysis/scheduled-updates/moreTable.html b/src/app/statistic-analysis/scheduled-updates/moreTable.html
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/statistic-analysis/scheduled-updates/notVerified.html b/src/app/statistic-analysis/scheduled-updates/notVerified.html
new file mode 100644
index 0000000..b562641
--- /dev/null
+++ b/src/app/statistic-analysis/scheduled-updates/notVerified.html
@@ -0,0 +1,16 @@
+
+
+
+
+
+ 月
+ 年
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/app/statistic-analysis/state/page-two-time/page-two-time.component.scss b/src/app/statistic-analysis/state/page-two-time/page-two-time.component.scss
index 5984003..5bbff55 100644
--- a/src/app/statistic-analysis/state/page-two-time/page-two-time.component.scss
+++ b/src/app/statistic-analysis/state/page-two-time/page-two-time.component.scss
@@ -17,35 +17,34 @@
}
}
+//头部搜索栏
.header {
- padding: 10px;
- box-sizing: border-box;
border-bottom: 1px solid #999;
- min-height: 70px;
- .queryBox {
- box-sizing: border-box;
- padding: 5px 15px;
- display: flex;
- flex-direction: row;
- flex-wrap: wrap;
- align-items:center;
- justify-content:center;
- .queryField {
- margin: 0 15px;
- font-size: 14px;
- input {
- width: 180px;
- height: 22px;
- line-height: 22px;
- }
- }
- .btnbox{
- float: right;
+ height: 70px;
+ box-sizing: border-box;
+ padding: 0 15px;
+ display: flex;
+ flex-direction: row;
+ flex-wrap: wrap;
+ align-items:center;
+ justify-content:center;
+ .queryField {
+ margin: 0 10px;
+ font-size: 14px;
+ .mat-form-field {
+ width: 130px;
+ max-height: 50px;;
+ margin: 0 15px 0 10px;
}
-
- } //queryBox
+ }
+ .fixedCss{
+ position: fixed;
+ top: 78px;
+ right: 32px;
+ }
}
+//echarts div公有样式
.publicCss{
height: 350px;
width: 50%;
diff --git a/src/app/statistic-analysis/state/page-two-time/page-two-time.component.ts b/src/app/statistic-analysis/state/page-two-time/page-two-time.component.ts
index b26dd39..618c624 100644
--- a/src/app/statistic-analysis/state/page-two-time/page-two-time.component.ts
+++ b/src/app/statistic-analysis/state/page-two-time/page-two-time.component.ts
@@ -20,18 +20,11 @@ export class PageTwoTimeComponent implements OnInit {
@ViewChild('pageTwoName')pageTwoName :PageTwoNameComponent; //父组件中获得子组件的引用
ngOnInit(): void {
- this.startTime = new FormControl( (new Date()).getFullYear()-10 )
- this.endTime = new FormControl( (new Date()).getFullYear() )
- this.adapter.setLocale('CH')
+ this.dateInit()
}
isQuery:boolean = true; //横纵向查询
- //查询
- query () {
-
- }
-
//shao
toggleTrue () {
this.isQuery = true
@@ -44,54 +37,58 @@ export class PageTwoTimeComponent implements OnInit {
this.echartsData.statefulInspectionToggle = true
}
- startTime:any; //查询开始时间
- endTime:any; //查询结束时间
-
- //选择开始时间
- startEvent (e: MatDatepickerInputEvent) {
- let nowTime = new Date()
- if (nowTime < e.value) {
+ selectType:string = 'month'; //选择当前的 查询类型 按月/年
+
+ //查询数据
+ years:any = []
+ selectMonth:any = [1,2,3,4,5,6,7,8,9,10,11,12]
+
+ //日期初始化
+ dateInit () {
+ let date = (new Date()).getFullYear()
+ for (let i=date; i>=date-10;i--) {
+ this.years.unshift(i)
+ }
+ }
+
+ selectOneYear:any = (new Date()).getFullYear() //开始年份
+ selectTwoYear:any = (new Date()).getFullYear() //结束年份
+ selectStartMonth:any = 1 //开始月份
+ selectEndMonth:any = (new Date()).getMonth()+1 //结束月份
+ //按月查询
+ monthSubmit (e) {
+ if (e.selectTwoYear >= e.selectOneYear) {
+ let startTime = e.selectOneYear + '-' + e.selectStartMonth + '-' + 1 + ' ' + 0 + ':' + 0 +':'+ 0
+ let endTime = e.selectTwoYear + '-' + e.selectEndMonth + '-' + 31 + ' ' + 23 + ':' + 59 +':'+ 59
+ console.log(startTime)
+ console.log(endTime)
+ } else {
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
- this.snackBar.open('选择时间不能大于现在时间段','确定',config);
- this.startTime = new FormControl( new Date(new Date().toLocaleDateString()) )
- } else {
- this.startTime = new FormControl(e.value)
+ this.snackBar.open('请选择正确时间区段','确定',config);
}
}
- //选择结束时间
- endEvent (e: MatDatepickerInputEvent) {
- let oneDay:number = 86399000; //一天的毫秒数
- let selectDay = (e.value).toLocaleDateString() //选择的年月日
- let newDay = (new Date()).toLocaleDateString() //现在的年月日
- let nowTime = new Date() //现在的时间
- if (nowTime < e.value && selectDay!=newDay) { //选择时间段大于现在时间段时
+
+ selectStartYear:any = (new Date()).getFullYear() //开始年份
+ selectEndYear:any = (new Date()).getFullYear() //结束年份
+ //按年查询
+ yearSubmit (e) {
+ if (e.selectEndYear >= e.selectStartYear) {
+ let startTime = e.selectStartYear + '-' + 1 + '-' + 1 + ' ' + 0 + ':' + 0 +':'+ 0
+ let endTime = e.selectEndYear + '-' + 12 + '-' + 31 + ' ' + 23 + ':' + 59 +':'+ 59
+ console.log(startTime)
+ console.log(endTime)
+ } else {
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
- this.snackBar.open('选择时间不能大于现在时间段','确定',config);
- this.endTime = new FormControl( new Date() )
- } else if (nowTime > e.value && selectDay!=newDay) { //正常情况下 时间+1天
- this.endTime = new FormControl( new Date(e.value.getTime()+oneDay) )
- } else if ( selectDay == newDay ) { //选择时间段是今天时
- this.endTime = new FormControl( new Date() )
+ this.snackBar.open('请选择正确时间区段','确定',config);
}
}
- //处理时间 传入 new Date()格式
- getTime(date){
- let year = date.getFullYear(); //年
- let month = date.getMonth() + 1; //月
- let day = date.getDate(); //日
- let hour = date.getHours() //时
- let min = date.getMinutes(); //分
- let seconds = date.getSeconds(); //秒
- return year+'-'+month+'-'+ day + " "+ hour +':'+ min +':'+ seconds;
- }
-
}
From cd5d09e25aa73395b43de5560160cb3a860e75c3 Mon Sep 17 00:00:00 2001
From: cpf <1105965053@qq.com>
Date: Thu, 3 Sep 2020 11:45:46 +0800
Subject: [PATCH 2/7] =?UTF-8?q?[=E5=AE=8C=E5=96=84]=20=E6=96=B0=E5=BB=BA?=
=?UTF-8?q?=E8=AE=A1=E5=88=92=E6=9B=B4=E6=96=B0=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../scheduled-updates.component.html | 1 +
.../scheduled-updates.component.scss | 0
.../scheduled-updates.component.spec.ts | 25 +++++++++++++++++++
.../scheduled-updates.component.ts | 15 +++++++++++
.../page-two-time/page-two-time.component.ts | 16 ++++++++++--
.../statistic-analysis-routing.module.ts | 4 ++-
.../statistic-analysis.module.ts | 3 ++-
7 files changed, 60 insertions(+), 4 deletions(-)
create mode 100644 src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.html
create mode 100644 src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.scss
create mode 100644 src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.spec.ts
create mode 100644 src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.ts
diff --git a/src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.html b/src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.html
new file mode 100644
index 0000000..e5a8cee
--- /dev/null
+++ b/src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.html
@@ -0,0 +1 @@
+;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ ScheduledUpdatesComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(ScheduledUpdatesComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.ts b/src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.ts
new file mode 100644
index 0000000..fb946f6
--- /dev/null
+++ b/src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.ts
@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+ selector: 'app-scheduled-updates',
+ templateUrl: './scheduled-updates.component.html',
+ styleUrls: ['./scheduled-updates.component.scss']
+})
+export class ScheduledUpdatesComponent implements OnInit {
+
+ constructor() { }
+
+ ngOnInit(): void {
+ }
+
+}
diff --git a/src/app/statistic-analysis/state/page-two-time/page-two-time.component.ts b/src/app/statistic-analysis/state/page-two-time/page-two-time.component.ts
index 618c624..886627a 100644
--- a/src/app/statistic-analysis/state/page-two-time/page-two-time.component.ts
+++ b/src/app/statistic-analysis/state/page-two-time/page-two-time.component.ts
@@ -57,12 +57,24 @@ export class PageTwoTimeComponent implements OnInit {
selectEndMonth:any = (new Date()).getMonth()+1 //结束月份
//按月查询
monthSubmit (e) {
- if (e.selectTwoYear >= e.selectOneYear) {
+ if (e.selectTwoYear > e.selectOneYear) {
let startTime = e.selectOneYear + '-' + e.selectStartMonth + '-' + 1 + ' ' + 0 + ':' + 0 +':'+ 0
let endTime = e.selectTwoYear + '-' + e.selectEndMonth + '-' + 31 + ' ' + 23 + ':' + 59 +':'+ 59
console.log(startTime)
console.log(endTime)
- } else {
+ } else if (e.selectTwoYear === e.selectOneYear) {
+ if(e.selectEndMonth >= e.selectStartMonth) {
+ let startTime = e.selectOneYear + '-' + e.selectStartMonth + '-' + 1 + ' ' + 0 + ':' + 0 +':'+ 0
+ let endTime = e.selectTwoYear + '-' + e.selectEndMonth + '-' + 31 + ' ' + 23 + ':' + 59 +':'+ 59
+ console.log(startTime)
+ console.log(endTime)
+ } else {
+ const config = new MatSnackBarConfig();
+ config.verticalPosition = 'top';
+ config.duration = 3000
+ this.snackBar.open('请选择正确时间区段','确定',config);
+ }
+ }else {
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
diff --git a/src/app/statistic-analysis/statistic-analysis-routing.module.ts b/src/app/statistic-analysis/statistic-analysis-routing.module.ts
index 1bbcbfb..4ac378c 100644
--- a/src/app/statistic-analysis/statistic-analysis-routing.module.ts
+++ b/src/app/statistic-analysis/statistic-analysis-routing.module.ts
@@ -9,6 +9,7 @@ import { DeleteTwoComponent } from './deleteUnit/delete-two/delete-two.component
import { DeleteThereComponent } from './deleteUnit/delete-there/delete-there.component';
import { DeleteFourComponent } from './deleteUnit/delete-four/delete-four.component';
import { BuildingTypeOneComponent } from './buildingType/building-type-one/building-type-one.component';
+import {ScheduledUpdatesComponent} from './scheduled-updates/scheduled-updates.component'
const routes: Routes = [
{ path: 'statePageOne', component: PageOneComponent},
@@ -17,7 +18,8 @@ const routes: Routes = [
{ path: 'delete_two', component: DeleteTwoComponent},
{ path: 'delete_there', component: DeleteThereComponent},
{ path: 'delete_four', component: DeleteFourComponent},
- { path: 'buildingType_one', component: BuildingTypeOneComponent}
+ { path: 'buildingType_one', component: BuildingTypeOneComponent},
+ { path: 'scheduledUpdates', component: ScheduledUpdatesComponent}
];
@NgModule({
diff --git a/src/app/statistic-analysis/statistic-analysis.module.ts b/src/app/statistic-analysis/statistic-analysis.module.ts
index 1b226ed..fbfec50 100644
--- a/src/app/statistic-analysis/statistic-analysis.module.ts
+++ b/src/app/statistic-analysis/statistic-analysis.module.ts
@@ -52,10 +52,11 @@ import { DeleteTwoComponent } from './deleteUnit/delete-two/delete-two.component
import { DeleteThereComponent } from './deleteUnit/delete-there/delete-there.component';
import { DeleteFourComponent } from './deleteUnit/delete-four/delete-four.component';
import { BuildingTypeOneComponent } from './buildingType/building-type-one/building-type-one.component';
+import { ScheduledUpdatesComponent } from './scheduled-updates/scheduled-updates.component';
@NgModule({
- declarations: [PageOneComponent, PageTwoTimeComponent, PageTwoNameComponent, PageZhongDuiDetailsComponent,echartsComponent, DeleteOneComponent, DeleteTwoComponent, DeleteThereComponent, DeleteFourComponent, BuildingTypeOneComponent],
+ declarations: [PageOneComponent, PageTwoTimeComponent, PageTwoNameComponent, PageZhongDuiDetailsComponent,echartsComponent, DeleteOneComponent, DeleteTwoComponent, DeleteThereComponent, DeleteFourComponent, BuildingTypeOneComponent, ScheduledUpdatesComponent],
imports: [
CommonModule,
StatisticAnalysisRoutingModule,
From c5ed2fc881b779409e8c8c7742754432fad314d5 Mon Sep 17 00:00:00 2001
From: SHAOJIAHAO <55341701@qq.com>
Date: Fri, 4 Sep 2020 13:39:08 +0800
Subject: [PATCH 3/7] =?UTF-8?q?[=E6=96=B0=E5=A2=9E]=E5=8D=95=E4=BD=8D?=
=?UTF-8?q?=E7=B1=BB=E5=9E=8B=E5=9F=BA=E6=9C=AC=E5=AE=8C=E6=88=90=EF=BC=8C?=
=?UTF-8?q?=E6=96=B0=E5=A2=9E=E5=8D=95=E4=BD=8D=E7=BB=9F=E8=AE=A1=E5=AE=8C?=
=?UTF-8?q?=E6=88=9050%=EF=BC=8C=E5=B0=81=E8=A3=85=E6=8F=90=E7=A4=BA?=
=?UTF-8?q?=E6=A1=86=E5=87=BD=E6=95=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../add-unit-one/add-unit-one.component.html | 4 +
.../add-unit-one/add-unit-one.component.scss | 8 +
.../add-unit-one.component.spec.ts | 25 ++
.../add-unit-one/add-unit-one.component.ts | 124 ++++++++
.../add-unit-two-time.component.html | 90 ++++++
.../add-unit-two-time.component.scss | 63 ++++
.../add-unit-two-time.component.spec.ts | 25 ++
.../add-unit-two-time.component.ts | 296 +++++++++++++++++
.../add-unit-two-type-details.component.html | 13 +
.../add-unit-two-type-details.component.scss | 42 +++
...dd-unit-two-type-details.component.spec.ts | 25 ++
.../add-unit-two-type-details.component.ts | 111 +++++++
...dd-unit-two-type-statistics.component.html | 32 ++
...dd-unit-two-type-statistics.component.scss | 45 +++
...unit-two-type-statistics.component.spec.ts | 25 ++
.../add-unit-two-type-statistics.component.ts | 297 +++++++++++++++++
.../building-type-one.component.html | 5 +-
.../building-type-one.component.scss | 8 +
.../building-type-one.component.ts | 115 ++++++-
...building-type-three-details.component.html | 13 +
...building-type-three-details.component.scss | 38 +++
...lding-type-three-details.component.spec.ts | 25 ++
.../building-type-three-details.component.ts | 110 +++++++
.../building-type-two-forward.component.html | 31 ++
.../building-type-two-forward.component.scss | 41 +++
...uilding-type-two-forward.component.spec.ts | 25 ++
.../building-type-two-forward.component.ts | 298 ++++++++++++++++++
.../building-type-two-reverse.component.html | 32 ++
.../building-type-two-reverse.component.scss | 41 +++
...uilding-type-two-reverse.component.spec.ts | 25 ++
.../building-type-two-reverse.component.ts | 296 +++++++++++++++++
.../echarts-data.service.ts | 129 ++++++++
.../state/page-one/page-one.component.scss | 2 +-
.../state/page-one/page-one.component.ts | 3 +-
.../page-two-name/page-two-name.component.ts | 2 -
.../page-two-time.component.scss | 2 +-
.../statistic-analysis-routing.module.ts | 16 +-
.../statistic-analysis.module.ts | 9 +-
38 files changed, 2479 insertions(+), 12 deletions(-)
create mode 100644 src/app/statistic-analysis/addUnit/add-unit-one/add-unit-one.component.html
create mode 100644 src/app/statistic-analysis/addUnit/add-unit-one/add-unit-one.component.scss
create mode 100644 src/app/statistic-analysis/addUnit/add-unit-one/add-unit-one.component.spec.ts
create mode 100644 src/app/statistic-analysis/addUnit/add-unit-one/add-unit-one.component.ts
create mode 100644 src/app/statistic-analysis/addUnit/add-unit-two-time/add-unit-two-time.component.html
create mode 100644 src/app/statistic-analysis/addUnit/add-unit-two-time/add-unit-two-time.component.scss
create mode 100644 src/app/statistic-analysis/addUnit/add-unit-two-time/add-unit-two-time.component.spec.ts
create mode 100644 src/app/statistic-analysis/addUnit/add-unit-two-time/add-unit-two-time.component.ts
create mode 100644 src/app/statistic-analysis/addUnit/add-unit-two-type-details/add-unit-two-type-details.component.html
create mode 100644 src/app/statistic-analysis/addUnit/add-unit-two-type-details/add-unit-two-type-details.component.scss
create mode 100644 src/app/statistic-analysis/addUnit/add-unit-two-type-details/add-unit-two-type-details.component.spec.ts
create mode 100644 src/app/statistic-analysis/addUnit/add-unit-two-type-details/add-unit-two-type-details.component.ts
create mode 100644 src/app/statistic-analysis/addUnit/add-unit-two-type-statistics/add-unit-two-type-statistics.component.html
create mode 100644 src/app/statistic-analysis/addUnit/add-unit-two-type-statistics/add-unit-two-type-statistics.component.scss
create mode 100644 src/app/statistic-analysis/addUnit/add-unit-two-type-statistics/add-unit-two-type-statistics.component.spec.ts
create mode 100644 src/app/statistic-analysis/addUnit/add-unit-two-type-statistics/add-unit-two-type-statistics.component.ts
create mode 100644 src/app/statistic-analysis/buildingType/building-type-three-details/building-type-three-details.component.html
create mode 100644 src/app/statistic-analysis/buildingType/building-type-three-details/building-type-three-details.component.scss
create mode 100644 src/app/statistic-analysis/buildingType/building-type-three-details/building-type-three-details.component.spec.ts
create mode 100644 src/app/statistic-analysis/buildingType/building-type-three-details/building-type-three-details.component.ts
create mode 100644 src/app/statistic-analysis/buildingType/building-type-two-forward/building-type-two-forward.component.html
create mode 100644 src/app/statistic-analysis/buildingType/building-type-two-forward/building-type-two-forward.component.scss
create mode 100644 src/app/statistic-analysis/buildingType/building-type-two-forward/building-type-two-forward.component.spec.ts
create mode 100644 src/app/statistic-analysis/buildingType/building-type-two-forward/building-type-two-forward.component.ts
create mode 100644 src/app/statistic-analysis/buildingType/building-type-two-reverse/building-type-two-reverse.component.html
create mode 100644 src/app/statistic-analysis/buildingType/building-type-two-reverse/building-type-two-reverse.component.scss
create mode 100644 src/app/statistic-analysis/buildingType/building-type-two-reverse/building-type-two-reverse.component.spec.ts
create mode 100644 src/app/statistic-analysis/buildingType/building-type-two-reverse/building-type-two-reverse.component.ts
diff --git a/src/app/statistic-analysis/addUnit/add-unit-one/add-unit-one.component.html b/src/app/statistic-analysis/addUnit/add-unit-one/add-unit-one.component.html
new file mode 100644
index 0000000..b560d1b
--- /dev/null
+++ b/src/app/statistic-analysis/addUnit/add-unit-one/add-unit-one.component.html
@@ -0,0 +1,4 @@
+
+
+
+
\ No newline at end of file
diff --git a/src/app/statistic-analysis/addUnit/add-unit-one/add-unit-one.component.scss b/src/app/statistic-analysis/addUnit/add-unit-one/add-unit-one.component.scss
new file mode 100644
index 0000000..1bffad0
--- /dev/null
+++ b/src/app/statistic-analysis/addUnit/add-unit-one/add-unit-one.component.scss
@@ -0,0 +1,8 @@
+.tishi{
+ width: 100%;
+ height: 100%;
+ span{
+ font-size: 25px;
+ text-align: center;
+ }
+}
\ No newline at end of file
diff --git a/src/app/statistic-analysis/addUnit/add-unit-one/add-unit-one.component.spec.ts b/src/app/statistic-analysis/addUnit/add-unit-one/add-unit-one.component.spec.ts
new file mode 100644
index 0000000..a7c2ab3
--- /dev/null
+++ b/src/app/statistic-analysis/addUnit/add-unit-one/add-unit-one.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AddUnitOneComponent } from './add-unit-one.component';
+
+describe('AddUnitOneComponent', () => {
+ let component: AddUnitOneComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ AddUnitOneComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(AddUnitOneComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
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
new file mode 100644
index 0000000..34673d9
--- /dev/null
+++ b/src/app/statistic-analysis/addUnit/add-unit-one/add-unit-one.component.ts
@@ -0,0 +1,124 @@
+import { Component, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
+declare var echarts: any;
+@Component({
+ selector: 'app-add-unit-one',
+ templateUrl: './add-unit-one.component.html',
+ styleUrls: ['./add-unit-one.component.scss']
+})
+export class AddUnitOneComponent implements OnInit {
+
+ constructor(private router: Router) { }
+
+ ngOnInit(): void {
+ window.setTimeout(()=>{
+ this.initCharts()
+ },0)
+ }
+ /* 首页饼状图 */
+ initCharts(){
+ let indexBzt = echarts.init(document.getElementById('indexBzt'));
+ let options={
+ title: {
+ text: '新增单位统计（8900家）',
+ left: 'center',
+ top: "7%",
+ textStyle: {
+ fontSize:31
+ }
+ },
+ tooltip: {
+ trigger: 'item',
+ formatter: (params)=>{
+ return this.biaogeTishi(params.name)
+ },
+ backgroundColor:'rgba(255,255,255,1)',//通过设置rgba调节背景颜色与透明度
+ borderWidth:'1',
+ borderRadius :'0'
+ },
+ legend: {
+ orient: 'vertical',
+ right: 150,
+ top:80,
+ data: ['高层', '地下', '轨道交通', '化工生产', '储罐类' , '厂房','古建筑', '商市场', '医院', '学校', '宾馆' , '娱乐场所','餐饮业', '影剧院', '展览建筑' , '隧道']
+ },
+ series: [
+ {
+ name: '访问来源',
+ type: 'pie',
+ radius: '60%',
+ center: ['50%', '53%'],
+ label:{
+ show:true,
+ fontSize:13,
+ formatter:'{b}{c}家\n{d|({d}%)}',
+ rich: {
+ d: {
+ align: 'center',
+ }
+ },
+ },
+ data: [
+ {value: 500, name: '高层'},
+ {value: 800, name: '地下'},
+ {value: 900, name: '轨道交通'},
+ {value: 800, name: '化工生产'},
+ {value: 1200, name: '储罐类'},
+ {value: 1500, name: '厂房'},
+ {value: 1400, name: '古建筑'},
+ {value: 600, name: '商市场'},
+ {value: 568, name: '医院'},
+ {value: 888, name: '学校'},
+ {value: 485, name: '宾馆'},
+ {value: 966, name: '娱乐场所'},
+ {value: 789, name: '餐饮业'},
+ {value: 500, name: '影剧院'},
+ {value: 1025, name: '展览建筑'},
+ {value: 600, name: '隧道'}
+ ],
+ emphasis: {
+ itemStyle: {
+ shadowBlur: 10,
+ shadowOffsetX: 0,
+ shadowColor: 'rgba(0, 0, 0, 0.5)'
+ }
+ }
+ }
+ ]
+ };
+ indexBzt.on('click', (params) => {
+ this.router.navigateByUrl('/statisticanalysis/addUnit_one/addUnit_two_type');
+ });
+ indexBzt.setOption(options);
+ }
+ biaogeTishi(biaotou:string){
+ var shuju='[{"name":"浦东支队","number":"156","zhanbi":"3%"},{"name":"黄埔支队","number":"144","zhanbi":"2.8%"},'
+ shuju+='{"name":"徐汇支队","number":"133","zhanbi":"2.1%"},{"name":"长宁支队","number":"122","zhanbi":"1.6%"},'
+ shuju+='{"name":"静安支队","number":"120","zhanbi":"1.3%"},{"name":"普陀支队","number":"100","zhanbi":"1.1%"},'
+ shuju+='{"name":"虹口支队","number":"95","zhanbi":"1%"},{"name":"杨浦支队","number":"90","zhanbi":"0.9%"},'
+ shuju+='{"name":"闵行支队","number":"88","zhanbi":"0.8%"},{"name":"宝山支队","number":"83","zhanbi":"0.7%"},'
+ shuju+='{"name":"徐汇支队","number":"133","zhanbi":"2.1%"},{"name":"长宁支队","number":"122","zhanbi":"1.6%"},'
+ shuju+='{"name":"嘉定支队","number":"78","zhanbi":"0.6%"},{"name":"松江支队","number":"75","zhanbi":"0.5%"},'
+ shuju+='{"name":"金山支队","number":"65","zhanbi":"0.4%"},{"name":"崇明支队","number":"55","zhanbi":"0.3%"}]'
+ var jsonObj = JSON.parse(shuju);
+ var res = '';
+ res+='
'
+ return res
+ }
+}
diff --git a/src/app/statistic-analysis/addUnit/add-unit-two-time/add-unit-two-time.component.html b/src/app/statistic-analysis/addUnit/add-unit-two-time/add-unit-two-time.component.html
new file mode 100644
index 0000000..9e608b0
--- /dev/null
+++ b/src/app/statistic-analysis/addUnit/add-unit-two-time/add-unit-two-time.component.html
@@ -0,0 +1,90 @@
+;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ AddUnitTwoTimeComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(AddUnitTwoTimeComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/statistic-analysis/addUnit/add-unit-two-time/add-unit-two-time.component.ts b/src/app/statistic-analysis/addUnit/add-unit-two-time/add-unit-two-time.component.ts
new file mode 100644
index 0000000..8cb7df2
--- /dev/null
+++ b/src/app/statistic-analysis/addUnit/add-unit-two-time/add-unit-two-time.component.ts
@@ -0,0 +1,296 @@
+import { Component, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
+import {MatDialog, MatDialogRef, MAT_DIALOG_DATA} from '@angular/material/dialog';
+import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar';
+import { EchartsDataService } from '../../echarts-data.service';
+declare var echarts: any;
+@Component({
+ selector: 'app-add-unit-two-time',
+ templateUrl: './add-unit-two-time.component.html',
+ styleUrls: ['./add-unit-two-time.component.scss']
+})
+export class AddUnitTwoTimeComponent implements OnInit {
+ forward(){
+ this.router.navigate(['/statisticanalysis/addUnit_one/addUnit_two_type'])
+ }
+ reverse(){
+ this.router.navigate(['/statisticanalysis/addUnit_one/addUnit_two_time'])
+ }
+ constructor(private router: Router,public dialog: MatDialog,public snackBar: MatSnackBar,private serviceData: EchartsDataService) { }
+
+ ngOnInit(): void {
+ this.dateInit ()
+ setTimeout(() => {
+ this.oneInit (this.date,this.dateNum)
+ this.twoInit (this.date,this.dateNum,'year')
+ }, 0);
+ }
+
+ selectType:string = 'month'; //选择当前的 查询类型 按月/年
+
+ //查询数据
+ years:any = []
+ selectMonth:any = [1,2,3,4,5,6,7,8,9,10,11,12]
+
+ //日期初始化
+ dateInit () {
+ let date = (new Date()).getFullYear()
+ for (let i=date; i>=date-10;i--) {
+ this.years.unshift(i)
+ }
+ }
+ selectOneYear:any = (new Date()).getFullYear() //开始年份
+ selectTwoYear:any = (new Date()).getFullYear() //结束年份
+ selectStartMonth:any = 1 //开始月份
+ selectEndMonth:any = (new Date()).getMonth()+1 //结束月份
+ //按月查询
+ monthSubmit (e) {
+ if (e.selectTwoYear > e.selectOneYear) {
+ let startTime = e.selectOneYear + '-' + e.selectStartMonth + '-' + 1 + ' ' + 0 + ':' + 0 +':'+ 0
+ let endTime = e.selectTwoYear + '-' + e.selectEndMonth + '-' + 31 + ' ' + 23 + ':' + 59 +':'+ 59
+ console.log(startTime)
+ console.log(endTime)
+ } else if (e.selectTwoYear === e.selectOneYear) {
+ if(e.selectEndMonth >= e.selectStartMonth) {
+ let startTime = e.selectOneYear + '-' + e.selectStartMonth + '-' + 1 + ' ' + 0 + ':' + 0 +':'+ 0
+ let endTime = e.selectTwoYear + '-' + e.selectEndMonth + '-' + 31 + ' ' + 23 + ':' + 59 +':'+ 59
+ console.log(startTime)
+ console.log(endTime)
+ } else {
+ const config = new MatSnackBarConfig();
+ config.verticalPosition = 'top';
+ config.duration = 3000
+ this.snackBar.open('请选择正确时间区段','确定',config);
+ }
+ }else {
+ const config = new MatSnackBarConfig();
+ config.verticalPosition = 'top';
+ config.duration = 3000
+ this.snackBar.open('请选择正确时间区段','确定',config);
+ }
+ }
+ selectStartYear:any = (new Date()).getFullYear() //开始年份
+ selectEndYear:any = (new Date()).getFullYear() //结束年份
+ //按年查询
+ yearSubmit (e) {
+ if (e.selectEndYear >= e.selectStartYear) {
+ let startTime = e.selectStartYear + '-' + 1 + '-' + 1 + ' ' + 0 + ':' + 0 +':'+ 0
+ let endTime = e.selectEndYear + '-' + 12 + '-' + 31 + ' ' + 23 + ':' + 59 +':'+ 59
+ console.log(startTime)
+ console.log(endTime)
+ } else {
+ const config = new MatSnackBarConfig();
+ config.verticalPosition = 'top';
+ config.duration = 3000
+ this.snackBar.open('请选择正确时间区段','确定',config);
+ }
+ }
+ //年或月点击
+ dateChange(){
+ this.forArr.forEach(item => {
+ item.echart.dispose()
+ })
+
+ if(this.selectType == "year"){
+ this.oneInit(this.date2,this.dateNum2)
+ this.twoInit(this.date2,this.dateNum2,'year')
+ }
+ if(this.selectType == "month"){
+ this.oneInit(this.date,this.dateNum)
+ this.twoInit(this.date,this.dateNum,'month')
+ }
+
+ }
+
+
+ forArr = [{id:'gaoceng',name:'高层',echart:null},
+ {id:'dixia',name:'地下',echart:null},
+ {id:'guidao',name:'轨道交通',echart:null},
+ {id:'huagong',name:'化工生产',echart:null},
+ {id:'chuguan',name:'储罐类',echart:null},
+ {id:'changfang',name:'厂房',echart:null},
+ {id:'gujianzhu',name:'古建筑',echart:null},
+ {id:'shichang',name:'商市场',echart:null},
+ {id:'yiyuan',name:'医院',echart:null},
+ {id:'xuexiao',name:'学校',echart:null},
+ {id:'binguan',name:'宾馆',echart:null},
+ {id:'yule',name:'娱乐场所',echart:null},
+ {id:'canyin',name:'餐饮业',echart:null},
+ {id:'yingyuan',name:'影剧院',echart:null},
+ {id:'zhanlan',name:'展览建筑',echart:null},
+ {id:'suidao',name:'隧道',echart:null}]
+
+
+ date = ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月','9月']
+ dateNum = [270, 253, 244, 199, 189, 173, 160, 198,200]
+
+ date2 = ['2019', '2020']
+ dateNum2 = [220, 180]
+
+ //新增数量统计
+ oneInit (date,dateNum) {
+ var chartQusj = echarts.init(document.getElementById('Line'), 'skinUpp');
+ var option = {
+ grid: {
+ top: 70,
+ left:40,
+ right: 20,
+ bottom: 20,
+ },
+ // 标题
+ title: {
+ text: '新增数量统计',
+ top: -4,
+ left: 'center',
+ textStyle:{
+ //文字颜色
+ color:'#000',
+ fontSize: 22,
+ }
+ },
+ //提示框
+ tooltip: {
+ trigger: 'axis',
+ backgroundColor:'rgba(255,255,255,1)',//通过设置rgba调节背景颜色与透明度
+ borderWidth:'1',
+ borderRadius :'0',
+ formatter: (params)=>{
+ return this.serviceData.tableTooltip(this.serviceData.buildingType,params[0].name)
+ },
+ position:this.serviceData.tableTooltipNoShow
+ },
+ // x轴
+ xAxis: {
+ type: 'category',
+ data: date,
+ axisLabel: {
+ color: "#000", //刻度线标签颜色
+ },
+ //设置坐标轴字体颜色和宽度
+ axisLine: {
+ lineStyle: {
+ color: "#000",
+ },
+ },
+ splitLine: {//分割线配置
+ show:true,
+ lineStyle: {
+ color: '#999',
+ }
+ }
+ },
+ // y轴
+ yAxis: {
+ type: 'value',
+ name: '个',
+ axisLabel: {
+ color: "#000" //刻度线标签颜色
+ },
+ //设置坐标轴字体颜色和宽度
+ axisLine: {
+ lineStyle: {
+ color: "#000",
+ }
+ }
+ },
+ // 数据
+ series: [{
+ name: '新增数量',
+ type: 'line',
+ data: dateNum,
+ }
+ ],
+ }
+ chartQusj.setOption(option);
+ }
+
+ //剩余折线图
+ twoInit (date,dateNum,typeName) {
+ this.forArr.forEach((item,key) => {
+ let that = this
+ item.echart = echarts.init(document.getElementById(item.id), 'skinUpp');
+ var option = {
+ grid: {
+ top: 50,
+ left:40,
+ right: 20,
+ bottom: 20,
+ },
+ // 标题
+ title: {
+ text: item.name,
+ top: -4,
+ left: 'center',
+ textStyle:{
+ //文字颜色
+ color:'#000',
+ }
+ },
+ //提示框
+ tooltip: {
+ trigger: 'axis',
+ backgroundColor:'rgba(255,255,255,1)',//通过设置rgba调节背景颜色与透明度
+ borderWidth:'1',
+ borderRadius :'0',
+ formatter: (params)=>{
+ return this.serviceData.tableTooltip(this.serviceData.tableDataZhi,params[0].name)
+ }
+ },
+ // x轴
+ xAxis: {
+ type: 'category',
+ data: date,
+ axisLabel: {
+ color: "#000", //刻度线标签颜色
+ },
+ //设置坐标轴字体颜色和宽度
+ axisLine: {
+ lineStyle: {
+ color: "#000",
+ },
+ },
+ splitLine: {//分割线配置
+ show:true,
+ lineStyle: {
+ color: '#999',
+ }
+ }
+ },
+ // y轴
+ yAxis: {
+ type: 'value',
+ name: '个',
+ axisLabel: {
+ color: "#000" //刻度线标签颜色
+ },
+ //设置坐标轴字体颜色和宽度
+ axisLine: {
+ lineStyle: {
+ color: "#000",
+ }
+ }
+ },
+ // 数据
+ series: [{
+ name: typeName,
+ type: 'line',
+ data: dateNum,
+ }
+ ],
+ };
+ item.echart.setOption(option,true);
+ // item.echart.on('click', (params) => {
+ // console.log(params)
+ // });
+ item.echart.getZr().on('click',params=>{
+ const pointInPixel= [params.offsetX, params.offsetY];
+ if (item.echart.containPixel('grid',pointInPixel)) {
+ let xIndex=item.echart.convertFromPixel({seriesIndex:0},[params.offsetX, params.offsetY])[0];
+ /*事件处理代码书写位置*/
+ console.log(option.series[0].data[xIndex],option.xAxis.data[xIndex])
+
+ }
+ });
+ })
+ }
+}
diff --git a/src/app/statistic-analysis/addUnit/add-unit-two-type-details/add-unit-two-type-details.component.html b/src/app/statistic-analysis/addUnit/add-unit-two-type-details/add-unit-two-type-details.component.html
new file mode 100644
index 0000000..8b8182f
--- /dev/null
+++ b/src/app/statistic-analysis/addUnit/add-unit-two-type-details/add-unit-two-type-details.component.html
@@ -0,0 +1,13 @@
+;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ AddUnitTwoTypeDetailsComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(AddUnitTwoTypeDetailsComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
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
new file mode 100644
index 0000000..63ea6f2
--- /dev/null
+++ b/src/app/statistic-analysis/addUnit/add-unit-two-type-details/add-unit-two-type-details.component.ts
@@ -0,0 +1,111 @@
+import { Component, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
+import { ActivatedRoute } from '@angular/router';
+declare var echarts: any;
+@Component({
+ selector: 'app-add-unit-two-type-details',
+ templateUrl: './add-unit-two-type-details.component.html',
+ styleUrls: ['./add-unit-two-type-details.component.scss']
+})
+export class AddUnitTwoTypeDetailsComponent implements OnInit {
+
+ constructor(public route: ActivatedRoute,private router: Router) { }
+ forward(){
+ this.router.navigate(['/statisticanalysis/addUnit_one/addUnit_two_type'])
+ }
+ reverse(){
+ this.router.navigate(['/statisticanalysis/addUnit_one/addUnit_two_time'])
+ }
+
+ organizationName:String
+ buildingTypeName:String
+
+ ngOnInit(): void {
+ this.route.queryParams.subscribe(params => {
+ this.organizationName = params['organizationName'];
+ this.buildingTypeName = params['buildingTypeName'];
+ });
+ window.setTimeout(()=>{
+ this.detailEcharts()
+ })
+ }
+ topTextlabel = {
+ show: true, // 开启显示
+ position: 'top', // 在上方显示
+ distance: 10, // 距离图形元素的距离。当 position 为字符描述值（如 'top'、'insideRight'）时候有效。
+ verticalAlign: 'middle',
+ textStyle: { // 数值样式
+ color: 'black',
+ fontSize: 12
+ }
+ }//柱状图数值顶部显示
+ zhongNameData = ["浦东中队","黄埔中队","徐汇中队","长宁中队","静安中队","普陀中队","虹口中队","杨浦中队","闵行中队","宝山中队","嘉定中队"]
+ zhongNumData = [200,190,180,170,160,150,140,130,120,110,100]
+ detailEcharts(){
+ var detailPlanEchart = echarts.init(document.getElementById('barEchart'));
+ var option = {
+ title: {
+ text: this.buildingTypeName + '(' +this.organizationName + ')',
+ left: "center",
+ textStyle: {
+ fontSize: 28
+ }
+ },
+ xAxis: {
+ type: 'category',
+ data: this.zhongNameData,
+ // axisLabel: this.axisLabel
+ },
+ yAxis: {
+ type: 'value'
+ },
+ tooltip: {
+ trigger: 'item',
+ formatter: (params)=>{
+ return this.tableTooltip(params)
+ },
+ backgroundColor:'rgba(255,255,255,1)',//通过设置rgba调节背景颜色与透明度
+ borderWidth:'1',
+ borderRadius :'0'
+ },
+ series: [{
+ data: this.zhongNumData,
+ type: 'bar',
+ showBackground: true,
+ barWidth :'58',
+ backgroundStyle: {
+ color: 'rgba(220, 220, 220, 0.8)'
+ },
+ label: this.topTextlabel
+ }]
+ };
+ detailPlanEchart.setOption(option);
+ }
+
+
+ tableTooltip(params:any){
+ var data = [
+ {name:params.name,number:params.value,zhanbi:(params.value/1340 * 100).toFixed(2) + "%"}
+ ]
+ var res = '';
+ res+='
'
+ return res
+ }
+
+}
diff --git a/src/app/statistic-analysis/addUnit/add-unit-two-type-statistics/add-unit-two-type-statistics.component.html b/src/app/statistic-analysis/addUnit/add-unit-two-type-statistics/add-unit-two-type-statistics.component.html
new file mode 100644
index 0000000..f2ff2ed
--- /dev/null
+++ b/src/app/statistic-analysis/addUnit/add-unit-two-type-statistics/add-unit-two-type-statistics.component.html
@@ -0,0 +1,32 @@
+;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ AddUnitTwoTypeStatisticsComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(AddUnitTwoTypeStatisticsComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/statistic-analysis/addUnit/add-unit-two-type-statistics/add-unit-two-type-statistics.component.ts b/src/app/statistic-analysis/addUnit/add-unit-two-type-statistics/add-unit-two-type-statistics.component.ts
new file mode 100644
index 0000000..cd4ade9
--- /dev/null
+++ b/src/app/statistic-analysis/addUnit/add-unit-two-type-statistics/add-unit-two-type-statistics.component.ts
@@ -0,0 +1,297 @@
+import { Component, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
+declare var echarts: any;
+@Component({
+ selector: 'app-add-unit-two-type-statistics',
+ templateUrl: './add-unit-two-type-statistics.component.html',
+ styleUrls: ['./add-unit-two-type-statistics.component.scss']
+})
+export class AddUnitTwoTypeStatisticsComponent implements OnInit {
+
+ constructor(private router: Router) { }
+
+ forward(){
+ this.router.navigate(['/statisticanalysis/addUnit_one/addUnit_two_type'])
+ }
+ reverse(){
+ this.router.navigate(['/statisticanalysis/addUnit_one/addUnit_two_time'])
+ }
+ ngOnInit(): void {
+ window.setTimeout(()=>{
+ this.initCharts()
+ this.barEcharts()
+ },0)
+ }
+
+ axisLabel = {
+ interval: 0,
+ formatter:function(value)
+ {
+ var ret = "";//拼接加\n返回的类目项
+ var maxLength = 2;//每项显示文字个数
+ 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;
+ }
+ }
+ }//echarts两个字换行
+
+ topTextlabel = {
+ show: true, // 开启显示
+ position: 'top', // 在上方显示
+ distance: 10, // 距离图形元素的距离。当 position 为字符描述值（如 'top'、'insideRight'）时候有效。
+ verticalAlign: 'middle',
+ textStyle: { // 数值样式
+ color: 'black',
+ fontSize: 12
+ }
+ }//柱状图数值顶部显示
+
+ tableDataZhi = [ {name:"浦东支队",number:"156",zhanbi:"3%"},
+ {name:"黄埔支队",number:"144",zhanbi:"2.8%"},
+ {name:"徐汇支队",number:"133",zhanbi:"2.1%"},
+ {name:"长宁支队",number:"122",zhanbi:"1.6%"},
+ {name:"静安支队",number:"120",zhanbi:"1.3%"},
+ {name:"普陀支队",number:"100",zhanbi:"1.1%"},
+ {name:"虹口支队",number:"95",zhanbi:"1%"},
+ {name:"杨浦支队",number:"90",zhanbi:"0.9%"},
+ {name:"闵行支队",number:"88",zhanbi:"0.8%"},
+ {name:"宝山支队",number:"83",zhanbi:"0.7%"},
+ {name:"徐汇支队",number:"133",zhanbi:"2.1%"},
+ {name:"长宁支队",number:"122",zhanbi:"1.6%"},
+ {name:"嘉定支队",number:"78",zhanbi:"0.6%"},
+ {name:"松江支队",number:"75",zhanbi:"0.5%"},
+ {name:"金山支队",number:"65",zhanbi:"0.4%"},
+ {name:"崇明支队",number:"55",zhanbi:"0.3%"} ]
+ tableDataZhong = [ {name:"浦东中队",number:"156",zhanbi:"3%"},
+ {name:"黄埔中队",number:"144",zhanbi:"2.8%"},
+ {name:"徐汇中队",number:"133",zhanbi:"2.1%"},
+ {name:"长宁中队",number:"122",zhanbi:"1.6%"},
+ {name:"静安中队",number:"120",zhanbi:"1.3%"},
+ {name:"普陀中队",number:"100",zhanbi:"1.1%"},
+ {name:"虹口中队",number:"95",zhanbi:"1%"},
+ {name:"杨浦中队",number:"90",zhanbi:"0.9%"},
+ {name:"闵行中队",number:"88",zhanbi:"0.8%"},
+ {name:"宝山中队",number:"83",zhanbi:"0.7%"},
+ {name:"徐汇中队",number:"133",zhanbi:"2.1%"},
+ {name:"长宁中队",number:"122",zhanbi:"1.6%"},
+ {name:"嘉定中队",number:"78",zhanbi:"0.6%"},
+ {name:"松江中队",number:"75",zhanbi:"0.5%"},
+ {name:"金山中队",number:"65",zhanbi:"0.4%"},
+ {name:"崇明中队",number:"55",zhanbi:"0.3%"} ]
+ zhiNameData = ["浦东支队","黄埔支队","徐汇支队","长宁支队","静安支队","普陀支队","虹口支队","杨浦支队","闵行支队","宝山支队","嘉定支队","松江支队","金山支队","崇明支队"]
+ zhiNumData = [200,190,180,170,160,150,140,130,120,110,100,90,80,70]
+ forArr = [{id:'gaoceng',name:'高层'},
+ {id:'dixia',name:'地下'},
+ {id:'guidao',name:'轨道交通'},
+ {id:'huagong',name:'化工生产'},
+ {id:'chuguan',name:'储罐类'},
+ {id:'changfang',name:'厂房'},
+ {id:'gujianzhu',name:'古建筑'},
+ {id:'shichang',name:'商市场'},
+ {id:'yiyuan',name:'医院'},
+ {id:'xuexiao',name:'学校'},
+ {id:'binguan',name:'宾馆'},
+ {id:'yule',name:'娱乐场所'},
+ {id:'canyin',name:'餐饮业'},
+ {id:'yingyuan',name:'影剧院'},
+ {id:'zhanlan',name:'展览建筑'},
+ {id:'suidao',name:'隧道'}]
+
+ /* 顶部饼状图 */
+ initCharts(){
+ let indexBzt = echarts.init(document.getElementById('pie'));
+ let options={
+ title: {
+ text: '新增单位统计（8900家）',
+ left: 'center',
+ top: "7%",
+ textStyle: {
+ fontSize:26
+ }
+ },
+ tooltip: {
+ trigger: 'item',
+ formatter: (params)=>{
+ return this.tableTooltip(this.tableDataZhi,params.name)
+ },
+ backgroundColor:'rgba(255,255,255,1)',//通过设置rgba调节背景颜色与透明度
+ borderWidth:'1',
+ borderRadius :'0',
+ position: function (point, params, dom, rect, size) {
+ // 鼠标坐标和提示框位置的参考坐标系是：以外层div的左上角那一点为原点，x轴向右，y轴向下
+ // 提示框位置
+ var x = 0; // x坐标位置
+ var y = 0; // y坐标位置
+
+ // 当前鼠标位置
+ var pointX = point[0];
+ var pointY = point[1];
+
+ // 外层div大小
+ // var viewWidth = size.viewSize[0];
+ // var viewHeight = size.viewSize[1];
+
+ // 提示框大小
+ var boxWidth = size.contentSize[0];
+ var boxHeight = size.contentSize[1];
+
+ // boxWidth > pointX 说明鼠标左边放不下提示框
+ if (boxWidth > pointX) {
+ x = 35;
+ } else { // 左边放的下
+ x = pointX + 80;
+ }
+
+ // boxHeight > pointY 说明鼠标上边放不下提示框
+ if (boxHeight > pointY) {
+ y = 65;
+ } else { // 上边放得下
+ y = pointY - boxHeight;
+ }
+
+ return [pointX, pointY];
+ }
+ },
+ legend: {
+ orient: 'vertical',
+ right: 150,
+ top:80,
+ data: ['高层', '地下', '轨道交通', '化工生产', '储罐类' , '厂房','古建筑', '商市场', '医院', '学校', '宾馆' , '娱乐场所','餐饮业', '影剧院', '展览建筑' , '隧道']
+ },
+ series: [
+ {
+ name: '访问来源',
+ type: 'pie',
+ radius: '60%',
+ center: ['50%', '60%'],
+ label:{
+ show:true,
+ fontSize:13,
+ formatter:'{b}{c}家\n{d|({d}%)}',
+ rich: {
+ d: {
+ align: 'center',
+ }
+ },
+ },
+ data: [
+ {value: 500, name: '高层'},
+ {value: 800, name: '地下'},
+ {value: 900, name: '轨道交通'},
+ {value: 800, name: '化工生产'},
+ {value: 1200, name: '储罐类'},
+ {value: 1500, name: '厂房'},
+ {value: 1400, name: '古建筑'},
+ {value: 600, name: '商市场'},
+ {value: 568, name: '医院'},
+ {value: 888, name: '学校'},
+ {value: 485, name: '宾馆'},
+ {value: 966, name: '娱乐场所'},
+ {value: 789, name: '餐饮业'},
+ {value: 500, name: '影剧院'},
+ {value: 1025, name: '展览建筑'},
+ {value: 600, name: '隧道'}
+ ],
+ emphasis: {
+ itemStyle: {
+ shadowBlur: 10,
+ shadowOffsetX: 0,
+ shadowColor: 'rgba(0, 0, 0, 0.5)'
+ }
+ }
+ }
+ ]
+ };
+ indexBzt.on('click', (params) => {
+ // this.router.navigateByUrl('/statisticanalysis/buildingType_two_forward');
+ });
+ indexBzt.setOption(options);
+ }
+ //柱状图
+ barEcharts(){
+ this.forArr.forEach(item=>{
+ let _this = this
+ let addEchart = echarts.init(document.getElementById(item.id));
+ let option = {
+ title: {
+ text: item.name,
+ left: "center",
+ top: "15",
+ textStyle: {
+ fontSize: 23
+ }
+ },
+ xAxis: {
+ type: 'category',
+ data: this.zhiNameData,
+ axisLabel: this.axisLabel
+ },
+ yAxis: {
+ type: 'value'
+ },
+ tooltip: {
+ trigger: 'item',
+ formatter: (params)=>{
+ return this.tableTooltip(this.tableDataZhong,params.name)
+ },
+ backgroundColor:'rgba(255,255,255,1)',//通过设置rgba调节背景颜色与透明度
+ borderWidth:'1',
+ borderRadius :'0'
+ },
+ series: [{
+ data: this.zhiNumData,
+ type: 'bar',
+ showBackground: true,
+ backgroundStyle: {
+ color: 'rgba(220, 220, 220, 0.8)'
+ },
+ barWidth :'28',
+ label: this.topTextlabel
+ }]
+ };
+ addEchart.setOption(option);
+ addEchart.on('click', (params) => {
+ this.router.navigate(['/statisticanalysis/addUnit_one/addUnit_two_typeDetails'],{queryParams:{'organizationName':params.name,'buildingTypeName':item.name}})
+ });
+ })
+
+ }
+ //提示框表格
+ tableTooltip(dataArr,title:string){
+ let data = dataArr
+ var res = '';
+ res+='
'
+ return res
+ }
+
+}
diff --git a/src/app/statistic-analysis/buildingType/building-type-one/building-type-one.component.html b/src/app/statistic-analysis/buildingType/building-type-one/building-type-one.component.html
index a6a2a6b..b560d1b 100644
--- a/src/app/statistic-analysis/buildingType/building-type-one/building-type-one.component.html
+++ b/src/app/statistic-analysis/buildingType/building-type-one/building-type-one.component.html
@@ -1 +1,4 @@
-';
+ res+='
'
+ return res
}
-
}
diff --git a/src/app/statistic-analysis/buildingType/building-type-three-details/building-type-three-details.component.html b/src/app/statistic-analysis/buildingType/building-type-three-details/building-type-three-details.component.html
new file mode 100644
index 0000000..14f2882
--- /dev/null
+++ b/src/app/statistic-analysis/buildingType/building-type-three-details/building-type-three-details.component.html
@@ -0,0 +1,13 @@
+;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ BuildingTypeThreeDetailsComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(BuildingTypeThreeDetailsComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
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
new file mode 100644
index 0000000..e180a13
--- /dev/null
+++ b/src/app/statistic-analysis/buildingType/building-type-three-details/building-type-three-details.component.ts
@@ -0,0 +1,110 @@
+import { Component, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
+import { ActivatedRoute } from '@angular/router';
+declare var echarts: any;
+@Component({
+ selector: 'app-building-type-three-details',
+ templateUrl: './building-type-three-details.component.html',
+ styleUrls: ['./building-type-three-details.component.scss']
+})
+export class BuildingTypeThreeDetailsComponent implements OnInit {
+
+ constructor(public route: ActivatedRoute,private router: Router) { }
+ forward(){
+ this.router.navigate(['/statisticanalysis/buildingType_one/buildingType_two_forward'])
+ }
+ reverse(){
+ this.router.navigate(['/statisticanalysis/buildingType_one/buildingType_two_reverse'])
+ }
+
+ organizationName:String
+ buildingTypeName:String
+
+ ngOnInit(): void {
+ this.route.queryParams.subscribe(params => {
+ this.organizationName = params['organizationName'];
+ this.buildingTypeName = params['buildingTypeName'];
+ });
+ window.setTimeout(()=>{
+ this.detailEcharts()
+ })
+ }
+ topTextlabel = {
+ show: true, // 开启显示
+ position: 'top', // 在上方显示
+ distance: 10, // 距离图形元素的距离。当 position 为字符描述值（如 'top'、'insideRight'）时候有效。
+ verticalAlign: 'middle',
+ textStyle: { // 数值样式
+ color: 'black',
+ fontSize: 12
+ }
+ }//柱状图数值顶部显示
+ zhongNameData = ["浦东中队","黄埔中队","徐汇中队","长宁中队","静安中队","普陀中队","虹口中队","杨浦中队","闵行中队","宝山中队","嘉定中队"]
+ zhongNumData = [200,190,180,170,160,150,140,130,120,110,100]
+ detailEcharts(){
+ var detailPlanEchart = echarts.init(document.getElementById('barEchart'));
+ var option = {
+ title: {
+ text: this.buildingTypeName + '(' +this.organizationName + ')',
+ left: "center",
+ textStyle: {
+ fontSize: 28
+ }
+ },
+ xAxis: {
+ type: 'category',
+ data: this.zhongNameData,
+ // axisLabel: this.axisLabel
+ },
+ yAxis: {
+ type: 'value'
+ },
+ tooltip: {
+ trigger: 'item',
+ formatter: (params)=>{
+ return this.tableTooltip(params)
+ },
+ backgroundColor:'rgba(255,255,255,1)',//通过设置rgba调节背景颜色与透明度
+ borderWidth:'1',
+ borderRadius :'0'
+ },
+ series: [{
+ data: this.zhongNumData,
+ type: 'bar',
+ showBackground: true,
+ barWidth :'58',
+ backgroundStyle: {
+ color: 'rgba(220, 220, 220, 0.8)'
+ },
+ label: this.topTextlabel
+ }]
+ };
+ detailPlanEchart.setOption(option);
+ }
+
+
+ tableTooltip(params:any){
+ var data = [
+ {name:params.name,number:params.value,zhanbi:(params.value/1340 * 100).toFixed(2) + "%"}
+ ]
+ var res = '';
+ res+='
'
+ return res
+ }
+}
diff --git a/src/app/statistic-analysis/buildingType/building-type-two-forward/building-type-two-forward.component.html b/src/app/statistic-analysis/buildingType/building-type-two-forward/building-type-two-forward.component.html
new file mode 100644
index 0000000..ab41180
--- /dev/null
+++ b/src/app/statistic-analysis/buildingType/building-type-two-forward/building-type-two-forward.component.html
@@ -0,0 +1,31 @@
+;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ BuildingTypeTwoForwardComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(BuildingTypeTwoForwardComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/statistic-analysis/buildingType/building-type-two-forward/building-type-two-forward.component.ts b/src/app/statistic-analysis/buildingType/building-type-two-forward/building-type-two-forward.component.ts
new file mode 100644
index 0000000..aaed0aa
--- /dev/null
+++ b/src/app/statistic-analysis/buildingType/building-type-two-forward/building-type-two-forward.component.ts
@@ -0,0 +1,298 @@
+import { Component, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
+declare var echarts: any;
+@Component({
+ selector: 'app-building-type-two-forward',
+ templateUrl: './building-type-two-forward.component.html',
+ styleUrls: ['./building-type-two-forward.component.scss']
+})
+export class BuildingTypeTwoForwardComponent implements OnInit {
+
+ constructor(private router: Router) { }
+ forward(){
+ this.router.navigate(['/statisticanalysis/buildingType_one/buildingType_two_forward'])
+ }
+ reverse(){
+ this.router.navigate(['/statisticanalysis/buildingType_one/buildingType_two_reverse'])
+ }
+ ngOnInit(): void {
+ window.setTimeout(()=>{
+ this.initCharts()
+ this.barEcharts()
+ },0)
+ }
+ axisLabel = {
+ interval: 0,
+ formatter:function(value)
+ {
+ var ret = "";//拼接加\n返回的类目项
+ var maxLength = 2;//每项显示文字个数
+ 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;
+ }
+ }
+ }//echarts两个字换行
+
+ topTextlabel = {
+ show: true, // 开启显示
+ position: 'top', // 在上方显示
+ distance: 10, // 距离图形元素的距离。当 position 为字符描述值（如 'top'、'insideRight'）时候有效。
+ verticalAlign: 'middle',
+ textStyle: { // 数值样式
+ color: 'black',
+ fontSize: 12
+ }
+ }//柱状图数值顶部显示
+
+ tableDataZhi = [ {name:"浦东支队",number:"156",zhanbi:"3%"},
+ {name:"黄埔支队",number:"144",zhanbi:"2.8%"},
+ {name:"徐汇支队",number:"133",zhanbi:"2.1%"},
+ {name:"长宁支队",number:"122",zhanbi:"1.6%"},
+ {name:"静安支队",number:"120",zhanbi:"1.3%"},
+ {name:"普陀支队",number:"100",zhanbi:"1.1%"},
+ {name:"虹口支队",number:"95",zhanbi:"1%"},
+ {name:"杨浦支队",number:"90",zhanbi:"0.9%"},
+ {name:"闵行支队",number:"88",zhanbi:"0.8%"},
+ {name:"宝山支队",number:"83",zhanbi:"0.7%"},
+ {name:"徐汇支队",number:"133",zhanbi:"2.1%"},
+ {name:"长宁支队",number:"122",zhanbi:"1.6%"},
+ {name:"嘉定支队",number:"78",zhanbi:"0.6%"},
+ {name:"松江支队",number:"75",zhanbi:"0.5%"},
+ {name:"金山支队",number:"65",zhanbi:"0.4%"},
+ {name:"崇明支队",number:"55",zhanbi:"0.3%"} ]
+ tableDataZhong = [ {name:"浦东中队",number:"156",zhanbi:"3%"},
+ {name:"黄埔中队",number:"144",zhanbi:"2.8%"},
+ {name:"徐汇中队",number:"133",zhanbi:"2.1%"},
+ {name:"长宁中队",number:"122",zhanbi:"1.6%"},
+ {name:"静安中队",number:"120",zhanbi:"1.3%"},
+ {name:"普陀中队",number:"100",zhanbi:"1.1%"},
+ {name:"虹口中队",number:"95",zhanbi:"1%"},
+ {name:"杨浦中队",number:"90",zhanbi:"0.9%"},
+ {name:"闵行中队",number:"88",zhanbi:"0.8%"},
+ {name:"宝山中队",number:"83",zhanbi:"0.7%"},
+ {name:"徐汇中队",number:"133",zhanbi:"2.1%"},
+ {name:"长宁中队",number:"122",zhanbi:"1.6%"},
+ {name:"嘉定中队",number:"78",zhanbi:"0.6%"},
+ {name:"松江中队",number:"75",zhanbi:"0.5%"},
+ {name:"金山中队",number:"65",zhanbi:"0.4%"},
+ {name:"崇明中队",number:"55",zhanbi:"0.3%"} ]
+ zhiNameData = ["浦东支队","黄埔支队","徐汇支队","长宁支队","静安支队","普陀支队","虹口支队","杨浦支队","闵行支队","宝山支队","嘉定支队","松江支队","金山支队","崇明支队",'青浦支队']
+ zhiNumData = [200,190,180,170,160,150,140,130,120,110,100,90,80,70,60]
+ pieData = [
+ {value: 500, name: '浦东支队'},
+ {value: 800, name: '黄埔支队'},
+ {value: 900, name: '徐汇支队'},
+ {value: 800, name: '长宁支队'},
+ {value: 1200, name: '静安支队'},
+ {value: 1500, name: '普陀支队'},
+ {value: 1400, name: '虹口支队'},
+ {value: 600, name: '杨浦支队'},
+ {value: 568, name: '闵行支队'},
+ {value: 888, name: '宝山支队'},
+ {value: 485, name: '嘉定支队'},
+ {value: 966, name: '松江支队'},
+ {value: 789, name: '金山支队'},
+ {value: 500, name: '崇明支队'},
+ {value: 1025, name: '展览建筑'},
+ {value: 600, name: '青浦支队'}
+ ]
+ buildingTypeName = ['高层','地下','轨道交通','化工生产','储罐类','厂房','古建筑','商市场','医院','学校','宾馆','娱乐场所','餐饮业','影剧院','展览建筑','隧道']
+ buildingTypeNum = [200,190,180,170,160,150,140,130,120,110,100,90,80,70,60,50]
+ forArr = [{id:'gaoceng',name:'浦东支队'},
+ {id:'dixia',name:'黄埔支队'},
+ {id:'guidao',name:'徐汇支队'},
+ {id:'huagong',name:'长宁支队'},
+ {id:'chuguan',name:'静安支队'},
+ {id:'changfang',name:'普陀支队'},
+ {id:'gujianzhu',name:'虹口支队'},
+ {id:'shichang',name:'杨浦支队'},
+ {id:'yiyuan',name:'闵行支队'},
+ {id:'xuexiao',name:'宝山支队'},
+ {id:'binguan',name:'嘉定支队'},
+ {id:'yule',name:'松江支队'},
+ {id:'canyin',name:'金山支队'},
+ {id:'yingyuan',name:'崇明支队'},
+ {id:'zhanlan',name:'青浦支队'},
+ ]
+
+ /* 顶部饼状图 */
+ initCharts(){
+ let indexBzt = echarts.init(document.getElementById('pie'));
+ let options={
+ title: {
+ text: '组织机构统计（5500家）',
+ left: 'center',
+ top: "7%",
+ textStyle: {
+ fontSize:26
+ }
+ },
+ tooltip: {
+ trigger: 'item',
+ formatter: (params)=>{
+ return this.tableTooltip(this.tableDataZhi,params.name)
+ },
+ backgroundColor:'rgba(255,255,255,1)',//通过设置rgba调节背景颜色与透明度
+ borderWidth:'1',
+ borderRadius :'0',
+ position: function (point, params, dom, rect, size) {
+ // 鼠标坐标和提示框位置的参考坐标系是：以外层div的左上角那一点为原点，x轴向右，y轴向下
+ // 提示框位置
+ var x = 0; // x坐标位置
+ var y = 0; // y坐标位置
+
+ // 当前鼠标位置
+ var pointX = point[0];
+ var pointY = point[1];
+
+ // 外层div大小
+ // var viewWidth = size.viewSize[0];
+ // var viewHeight = size.viewSize[1];
+
+ // 提示框大小
+ var boxWidth = size.contentSize[0];
+ var boxHeight = size.contentSize[1];
+
+ // boxWidth > pointX 说明鼠标左边放不下提示框
+ if (boxWidth > pointX) {
+ x = 35;
+ } else { // 左边放的下
+ x = pointX + 80;
+ }
+
+ // boxHeight > pointY 说明鼠标上边放不下提示框
+ if (boxHeight > pointY) {
+ y = 65;
+ } else { // 上边放得下
+ y = pointY - boxHeight;
+ }
+
+ return [pointX, pointY];
+ }
+ },
+ legend: {
+ orient: 'vertical',
+ right: 150,
+ top:80,
+ data:this.zhiNameData
+ },
+ series: [
+ {
+ name: '访问来源',
+ type: 'pie',
+ radius: '60%',
+ center: ['50%', '60%'],
+ label:{
+ show:true,
+ fontSize:13,
+ formatter:'{b}{c}家\n{d|({d}%)}',
+ rich: {
+ d: {
+ align: 'center',
+ }
+ },
+ },
+ data: this.pieData,
+ emphasis: {
+ itemStyle: {
+ shadowBlur: 10,
+ shadowOffsetX: 0,
+ shadowColor: 'rgba(0, 0, 0, 0.5)'
+ }
+ }
+ }
+ ]
+ };
+ indexBzt.on('click', (params) => {
+ // this.router.navigateByUrl('/statisticanalysis/buildingType_two_forward');
+ });
+ indexBzt.setOption(options);
+ }
+ //柱状图
+ barEcharts(){
+ this.forArr.forEach(item=>{
+ let _this = this
+ let Echart = echarts.init(document.getElementById(item.id));
+ let option = {
+ color: ['#3398DB'],
+ title: {
+ text: item.name,
+ left: "center",
+ top: "15",
+ textStyle: {
+ fontSize: 23
+ }
+ },
+ xAxis: {
+ type: 'category',
+ data: this.buildingTypeName,
+ axisLabel: this.axisLabel
+ },
+ yAxis: {
+ type: 'value'
+ },
+ tooltip: {
+ trigger: 'item',
+ formatter: (params)=>{
+ return this.tableTooltip(this.tableDataZhong,params.name)
+ },
+ backgroundColor:'rgba(255,255,255,1)',//通过设置rgba调节背景颜色与透明度
+ borderWidth:'1',
+ borderRadius :'0'
+ },
+ series: [{
+ data: this.buildingTypeNum,
+ type: 'bar',
+ showBackground: true,
+ backgroundStyle: {
+ color: 'rgba(220, 220, 220, 0.8)'
+ },
+ barWidth :'28',
+ label: this.topTextlabel
+ }]
+ };
+ Echart.setOption(option);
+ Echart.on('click', (params) => {
+ this.router.navigate(['/statisticanalysis/buildingType_one/buildingType_three_details'],{queryParams:{'organizationName':item.name,'buildingTypeName':params.name}})
+ });
+ })
+
+ }
+ //提示框表格
+ tableTooltip(dataArr,title:string){
+ let data = dataArr
+ var res = '';
+ res+='
'
+ return res
+ }
+}
diff --git a/src/app/statistic-analysis/buildingType/building-type-two-reverse/building-type-two-reverse.component.html b/src/app/statistic-analysis/buildingType/building-type-two-reverse/building-type-two-reverse.component.html
new file mode 100644
index 0000000..bdb66e9
--- /dev/null
+++ b/src/app/statistic-analysis/buildingType/building-type-two-reverse/building-type-two-reverse.component.html
@@ -0,0 +1,32 @@
+;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ BuildingTypeTwoReverseComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(BuildingTypeTwoReverseComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/statistic-analysis/buildingType/building-type-two-reverse/building-type-two-reverse.component.ts b/src/app/statistic-analysis/buildingType/building-type-two-reverse/building-type-two-reverse.component.ts
new file mode 100644
index 0000000..22efeb3
--- /dev/null
+++ b/src/app/statistic-analysis/buildingType/building-type-two-reverse/building-type-two-reverse.component.ts
@@ -0,0 +1,296 @@
+import { Component, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
+declare var echarts: any;
+@Component({
+ selector: 'app-building-type-two-reverse',
+ templateUrl: './building-type-two-reverse.component.html',
+ styleUrls: ['./building-type-two-reverse.component.scss']
+})
+export class BuildingTypeTwoReverseComponent implements OnInit {
+
+ constructor(private router: Router) { }
+
+ forward(){
+ this.router.navigate(['/statisticanalysis/buildingType_one/buildingType_two_forward'])
+ }
+ reverse(){
+ this.router.navigate(['/statisticanalysis/buildingType_one/buildingType_two_reverse'])
+ }
+ ngOnInit(): void {
+ window.setTimeout(()=>{
+ this.initCharts()
+ this.barEcharts()
+ },0)
+ }
+
+ axisLabel = {
+ interval: 0,
+ formatter:function(value)
+ {
+ var ret = "";//拼接加\n返回的类目项
+ var maxLength = 2;//每项显示文字个数
+ 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;
+ }
+ }
+ }//echarts两个字换行
+
+ topTextlabel = {
+ show: true, // 开启显示
+ position: 'top', // 在上方显示
+ distance: 10, // 距离图形元素的距离。当 position 为字符描述值（如 'top'、'insideRight'）时候有效。
+ verticalAlign: 'middle',
+ textStyle: { // 数值样式
+ color: 'black',
+ fontSize: 12
+ }
+ }//柱状图数值顶部显示
+
+ tableDataZhi = [ {name:"浦东支队",number:"156",zhanbi:"3%"},
+ {name:"黄埔支队",number:"144",zhanbi:"2.8%"},
+ {name:"徐汇支队",number:"133",zhanbi:"2.1%"},
+ {name:"长宁支队",number:"122",zhanbi:"1.6%"},
+ {name:"静安支队",number:"120",zhanbi:"1.3%"},
+ {name:"普陀支队",number:"100",zhanbi:"1.1%"},
+ {name:"虹口支队",number:"95",zhanbi:"1%"},
+ {name:"杨浦支队",number:"90",zhanbi:"0.9%"},
+ {name:"闵行支队",number:"88",zhanbi:"0.8%"},
+ {name:"宝山支队",number:"83",zhanbi:"0.7%"},
+ {name:"徐汇支队",number:"133",zhanbi:"2.1%"},
+ {name:"长宁支队",number:"122",zhanbi:"1.6%"},
+ {name:"嘉定支队",number:"78",zhanbi:"0.6%"},
+ {name:"松江支队",number:"75",zhanbi:"0.5%"},
+ {name:"金山支队",number:"65",zhanbi:"0.4%"},
+ {name:"崇明支队",number:"55",zhanbi:"0.3%"} ]
+ tableDataZhong = [ {name:"浦东中队",number:"156",zhanbi:"3%"},
+ {name:"黄埔中队",number:"144",zhanbi:"2.8%"},
+ {name:"徐汇中队",number:"133",zhanbi:"2.1%"},
+ {name:"长宁中队",number:"122",zhanbi:"1.6%"},
+ {name:"静安中队",number:"120",zhanbi:"1.3%"},
+ {name:"普陀中队",number:"100",zhanbi:"1.1%"},
+ {name:"虹口中队",number:"95",zhanbi:"1%"},
+ {name:"杨浦中队",number:"90",zhanbi:"0.9%"},
+ {name:"闵行中队",number:"88",zhanbi:"0.8%"},
+ {name:"宝山中队",number:"83",zhanbi:"0.7%"},
+ {name:"徐汇中队",number:"133",zhanbi:"2.1%"},
+ {name:"长宁中队",number:"122",zhanbi:"1.6%"},
+ {name:"嘉定中队",number:"78",zhanbi:"0.6%"},
+ {name:"松江中队",number:"75",zhanbi:"0.5%"},
+ {name:"金山中队",number:"65",zhanbi:"0.4%"},
+ {name:"崇明中队",number:"55",zhanbi:"0.3%"} ]
+ zhiNameData = ["浦东支队","黄埔支队","徐汇支队","长宁支队","静安支队","普陀支队","虹口支队","杨浦支队","闵行支队","宝山支队","嘉定支队","松江支队","金山支队","崇明支队"]
+ zhiNumData = [200,190,180,170,160,150,140,130,120,110,100,90,80,70]
+ forArr = [{id:'gaoceng',name:'高层'},
+ {id:'dixia',name:'地下'},
+ {id:'guidao',name:'轨道交通'},
+ {id:'huagong',name:'化工生产'},
+ {id:'chuguan',name:'储罐类'},
+ {id:'changfang',name:'厂房'},
+ {id:'gujianzhu',name:'古建筑'},
+ {id:'shichang',name:'商市场'},
+ {id:'yiyuan',name:'医院'},
+ {id:'xuexiao',name:'学校'},
+ {id:'binguan',name:'宾馆'},
+ {id:'yule',name:'娱乐场所'},
+ {id:'canyin',name:'餐饮业'},
+ {id:'yingyuan',name:'影剧院'},
+ {id:'zhanlan',name:'展览建筑'},
+ {id:'suidao',name:'隧道'}]
+
+ /* 顶部饼状图 */
+ initCharts(){
+ let indexBzt = echarts.init(document.getElementById('pie'));
+ let options={
+ title: {
+ text: '建筑类型统计（8900家）',
+ left: 'center',
+ top: "7%",
+ textStyle: {
+ fontSize:26
+ }
+ },
+ tooltip: {
+ trigger: 'item',
+ formatter: (params)=>{
+ return this.tableTooltip(this.tableDataZhi,params.name)
+ },
+ backgroundColor:'rgba(255,255,255,1)',//通过设置rgba调节背景颜色与透明度
+ borderWidth:'1',
+ borderRadius :'0',
+ position: function (point, params, dom, rect, size) {
+ // 鼠标坐标和提示框位置的参考坐标系是：以外层div的左上角那一点为原点，x轴向右，y轴向下
+ // 提示框位置
+ var x = 0; // x坐标位置
+ var y = 0; // y坐标位置
+
+ // 当前鼠标位置
+ var pointX = point[0];
+ var pointY = point[1];
+
+ // 外层div大小
+ // var viewWidth = size.viewSize[0];
+ // var viewHeight = size.viewSize[1];
+
+ // 提示框大小
+ var boxWidth = size.contentSize[0];
+ var boxHeight = size.contentSize[1];
+
+ // boxWidth > pointX 说明鼠标左边放不下提示框
+ if (boxWidth > pointX) {
+ x = 35;
+ } else { // 左边放的下
+ x = pointX + 80;
+ }
+
+ // boxHeight > pointY 说明鼠标上边放不下提示框
+ if (boxHeight > pointY) {
+ y = 65;
+ } else { // 上边放得下
+ y = pointY - boxHeight;
+ }
+
+ return [pointX, pointY];
+ }
+ },
+ legend: {
+ orient: 'vertical',
+ right: 150,
+ top:80,
+ data: ['高层', '地下', '轨道交通', '化工生产', '储罐类' , '厂房','古建筑', '商市场', '医院', '学校', '宾馆' , '娱乐场所','餐饮业', '影剧院', '展览建筑' , '隧道']
+ },
+ series: [
+ {
+ name: '访问来源',
+ type: 'pie',
+ radius: '60%',
+ center: ['50%', '60%'],
+ label:{
+ show:true,
+ fontSize:13,
+ formatter:'{b}{c}家\n{d|({d}%)}',
+ rich: {
+ d: {
+ align: 'center',
+ }
+ },
+ },
+ data: [
+ {value: 500, name: '高层'},
+ {value: 800, name: '地下'},
+ {value: 900, name: '轨道交通'},
+ {value: 800, name: '化工生产'},
+ {value: 1200, name: '储罐类'},
+ {value: 1500, name: '厂房'},
+ {value: 1400, name: '古建筑'},
+ {value: 600, name: '商市场'},
+ {value: 568, name: '医院'},
+ {value: 888, name: '学校'},
+ {value: 485, name: '宾馆'},
+ {value: 966, name: '娱乐场所'},
+ {value: 789, name: '餐饮业'},
+ {value: 500, name: '影剧院'},
+ {value: 1025, name: '展览建筑'},
+ {value: 600, name: '隧道'}
+ ],
+ emphasis: {
+ itemStyle: {
+ shadowBlur: 10,
+ shadowOffsetX: 0,
+ shadowColor: 'rgba(0, 0, 0, 0.5)'
+ }
+ }
+ }
+ ]
+ };
+ indexBzt.on('click', (params) => {
+ // this.router.navigateByUrl('/statisticanalysis/buildingType_two_forward');
+ });
+ indexBzt.setOption(options);
+ }
+ //柱状图
+ barEcharts(){
+ this.forArr.forEach(item=>{
+ let _this = this
+ let addEchart = echarts.init(document.getElementById(item.id));
+ let option = {
+ title: {
+ text: item.name,
+ left: "center",
+ top: "15",
+ textStyle: {
+ fontSize: 23
+ }
+ },
+ xAxis: {
+ type: 'category',
+ data: this.zhiNameData,
+ axisLabel: this.axisLabel
+ },
+ yAxis: {
+ type: 'value'
+ },
+ tooltip: {
+ trigger: 'item',
+ formatter: (params)=>{
+ return this.tableTooltip(this.tableDataZhong,params.name)
+ },
+ backgroundColor:'rgba(255,255,255,1)',//通过设置rgba调节背景颜色与透明度
+ borderWidth:'1',
+ borderRadius :'0'
+ },
+ series: [{
+ data: this.zhiNumData,
+ type: 'bar',
+ showBackground: true,
+ backgroundStyle: {
+ color: 'rgba(220, 220, 220, 0.8)'
+ },
+ barWidth :'28',
+ label: this.topTextlabel
+ }]
+ };
+ addEchart.setOption(option);
+ addEchart.on('click', (params) => {
+ this.router.navigate(['/statisticanalysis/buildingType_one/buildingType_three_details'],{queryParams:{'organizationName':params.name,'buildingTypeName':item.name}})
+ });
+ })
+
+ }
+ //提示框表格
+ tableTooltip(dataArr,title:string){
+ let data = dataArr
+ var res = '';
+ res+='
'
+ return res
+ }
+}
diff --git a/src/app/statistic-analysis/echarts-data.service.ts b/src/app/statistic-analysis/echarts-data.service.ts
index b6a0ca3..d56c4c1 100644
--- a/src/app/statistic-analysis/echarts-data.service.ts
+++ b/src/app/statistic-analysis/echarts-data.service.ts
@@ -12,5 +12,134 @@ export class EchartsDataService {
statefulInspectionToggle:boolean = true; // true=显示所有柱状图 flase=显示当前点击柱状图
+ //支队提示框
+ tableDataZhi = [
+ {name:"浦东支队",number:"156",zhanbi:"3%"},
+ {name:"黄埔支队",number:"144",zhanbi:"2.8%"},
+ {name:"徐汇支队",number:"133",zhanbi:"2.1%"},
+ {name:"长宁支队",number:"122",zhanbi:"1.6%"},
+ {name:"静安支队",number:"120",zhanbi:"1.3%"},
+ {name:"普陀支队",number:"100",zhanbi:"1.1%"},
+ {name:"虹口支队",number:"95",zhanbi:"1%"},
+ {name:"杨浦支队",number:"90",zhanbi:"0.9%"},
+ {name:"闵行支队",number:"88",zhanbi:"0.8%"},
+ {name:"宝山支队",number:"83",zhanbi:"0.7%"},
+ {name:"徐汇支队",number:"133",zhanbi:"2.1%"},
+ {name:"长宁支队",number:"122",zhanbi:"1.6%"},
+ {name:"嘉定支队",number:"78",zhanbi:"0.6%"},
+ {name:"松江支队",number:"75",zhanbi:"0.5%"},
+ {name:"金山支队",number:"65",zhanbi:"0.4%"},
+ {name:"崇明支队",number:"55",zhanbi:"0.3%"}
+ ]
+ //中队提示框
+ tableDataZhong = [
+ {name:"浦东中队",number:"156",zhanbi:"3%"},
+ {name:"黄埔中队",number:"144",zhanbi:"2.8%"},
+ {name:"徐汇中队",number:"133",zhanbi:"2.1%"},
+ {name:"长宁中队",number:"122",zhanbi:"1.6%"},
+ {name:"静安中队",number:"120",zhanbi:"1.3%"},
+ {name:"普陀中队",number:"100",zhanbi:"1.1%"},
+ {name:"虹口中队",number:"95",zhanbi:"1%"},
+ {name:"杨浦中队",number:"90",zhanbi:"0.9%"},
+ {name:"闵行中队",number:"88",zhanbi:"0.8%"},
+ {name:"宝山中队",number:"83",zhanbi:"0.7%"},
+ {name:"徐汇中队",number:"133",zhanbi:"2.1%"},
+ {name:"长宁中队",number:"122",zhanbi:"1.6%"},
+ {name:"嘉定中队",number:"78",zhanbi:"0.6%"},
+ {name:"松江中队",number:"75",zhanbi:"0.5%"},
+ {name:"金山中队",number:"65",zhanbi:"0.4%"},
+ {name:"崇明中队",number:"55",zhanbi:"0.3%"}
+ ]
+ //建筑类型提示框
+ buildingType = [
+ {name:"高层",number:"156",zhanbi:"3%"},
+ {name:"地下",number:"144",zhanbi:"2.8%"},
+ {name:"轨道交通",number:"133",zhanbi:"2.1%"},
+ {name:"化工生产",number:"122",zhanbi:"1.6%"},
+ {name:"储罐类",number:"120",zhanbi:"1.3%"},
+ {name:"厂房",number:"100",zhanbi:"1.1%"},
+ {name:"古建筑",number:"95",zhanbi:"1%"},
+ {name:"商市场",number:"90",zhanbi:"0.9%"},
+ {name:"医院",number:"88",zhanbi:"0.8%"},
+ {name:"学校",number:"83",zhanbi:"0.7%"},
+ {name:"宾馆",number:"133",zhanbi:"2.1%"},
+ {name:"娱乐场所",number:"122",zhanbi:"1.6%"},
+ {name:"餐饮业",number:"78",zhanbi:"0.6%"},
+ {name:"影剧院",number:"75",zhanbi:"0.5%"},
+ {name:"展览建筑",number:"65",zhanbi:"0.4%"},
+ {name:"隧道",number:"55",zhanbi:"0.3%"}
+ ]
+ //提示框表格
+ tableTooltip(dataArr,title:string){
+ let data = dataArr
+ var res = '';
+ res+='
'
+ return res
+ }
+ //如果提示框显示不开
+ tableTooltipNoShow(point, params, dom, rect, size) {
+ // 鼠标坐标和提示框位置的参考坐标系是：以外层div的左上角那一点为原点，x轴向右，y轴向下
+ // 提示框位置
+ var x = 0; // x坐标位置
+ var y = 0; // y坐标位置
+
+ // 当前鼠标位置
+ var pointX = point[0];
+ var pointY = point[1];
+
+ // 外层div大小
+ // var viewWidth = size.viewSize[0];
+ // var viewHeight = size.viewSize[1];
+
+ // 提示框大小
+ var boxWidth = size.contentSize[0];
+ var boxHeight = size.contentSize[1];
+
+ // boxWidth > pointX 说明鼠标左边放不下提示框
+ if (boxWidth > pointX) {
+ x = 35;
+ } else { // 左边放的下
+ x = pointX + 80;
+ }
+
+ // boxHeight > pointY 说明鼠标上边放不下提示框
+ if (boxHeight > pointY) {
+ y = 65;
+ } else { // 上边放得下
+ y = pointY - boxHeight;
+ }
+
+ return [pointX, pointY];
+ }
+
+
+ //用法：
+
+ // tooltip: {
+ // trigger: 'axis',
+ // backgroundColor:'rgba(255,255,255,1)',//通过设置rgba调节背景颜色与透明度
+ // borderWidth:'1',
+ // borderRadius :'0',
+ // formatter: (params)=>{
+ // return this.serviceData.tableTooltip(this.serviceData.buildingType,params[0].name)
+ // },
+ // position:this.serviceData.tableTooltipNoShow
+ // }
}
diff --git a/src/app/statistic-analysis/state/page-one/page-one.component.scss b/src/app/statistic-analysis/state/page-one/page-one.component.scss
index 8ff7710..1bffad0 100644
--- a/src/app/statistic-analysis/state/page-one/page-one.component.scss
+++ b/src/app/statistic-analysis/state/page-one/page-one.component.scss
@@ -4,5 +4,5 @@
span{
font-size: 25px;
text-align: center;
-}
+ }
}
\ No newline at end of file
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 1563f44..edbe514 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
@@ -19,7 +19,6 @@ declare var echarts: any;
export class PageOneComponent implements OnInit {
options:any;
-
constructor(private router: Router) { }
ngOnInit() {
@@ -103,7 +102,7 @@ export class PageOneComponent implements OnInit {
indexBzt.on('click', (params) => {
this.router.navigateByUrl('/statisticanalysis/statePageTwo_time');
});
- indexBzt.setOption(options);
+ indexBzt.setOption(options);
}
/**
* @name: 表格提示框封装
diff --git a/src/app/statistic-analysis/state/page-two-name/page-two-name.component.ts b/src/app/statistic-analysis/state/page-two-name/page-two-name.component.ts
index 646b135..ac56a0b 100644
--- a/src/app/statistic-analysis/state/page-two-name/page-two-name.component.ts
+++ b/src/app/statistic-analysis/state/page-two-name/page-two-name.component.ts
@@ -307,8 +307,6 @@ export class PageTwoNameComponent implements OnInit {
//预案状态统计
planState(){
- var shuju='[{"name":"浦东支队","number":"23","zhanbi":"21%"},{"name":"浦东支队","number":"23","zhanbi":"21%"},{"name":"浦东支队","number":"23","zhanbi":"21%"},{"name":"浦东支队","number":"23","zhanbi":"21%"},{"name":"浦东支队","number":"23","zhanbi":"21%"}]';
- var jsonObj = JSON.parse(shuju);
var passPlanEchart = echarts.init(document.getElementById('pie'));
var option = {
title: {
diff --git a/src/app/statistic-analysis/state/page-two-time/page-two-time.component.scss b/src/app/statistic-analysis/state/page-two-time/page-two-time.component.scss
index 5984003..ce92b6e 100644
--- a/src/app/statistic-analysis/state/page-two-time/page-two-time.component.scss
+++ b/src/app/statistic-analysis/state/page-two-time/page-two-time.component.scss
@@ -12,7 +12,7 @@
.center {
width: 100%;
height: 100%;
- overflow: auto;;
+ overflow: auto;
}
}
}
diff --git a/src/app/statistic-analysis/statistic-analysis-routing.module.ts b/src/app/statistic-analysis/statistic-analysis-routing.module.ts
index 1bbcbfb..acd3c20 100644
--- a/src/app/statistic-analysis/statistic-analysis-routing.module.ts
+++ b/src/app/statistic-analysis/statistic-analysis-routing.module.ts
@@ -9,6 +9,13 @@ import { DeleteTwoComponent } from './deleteUnit/delete-two/delete-two.component
import { DeleteThereComponent } from './deleteUnit/delete-there/delete-there.component';
import { DeleteFourComponent } from './deleteUnit/delete-four/delete-four.component';
import { BuildingTypeOneComponent } from './buildingType/building-type-one/building-type-one.component';
+import { BuildingTypeTwoForwardComponent } from './buildingType/building-type-two-forward/building-type-two-forward.component';
+import { BuildingTypeTwoReverseComponent } from './buildingType/building-type-two-reverse/building-type-two-reverse.component';
+import { BuildingTypeThreeDetailsComponent } from './buildingType/building-type-three-details/building-type-three-details.component';
+import { AddUnitOneComponent } from './addUnit/add-unit-one/add-unit-one.component';
+import { AddUnitTwoTypeStatisticsComponent } from './addUnit/add-unit-two-type-statistics/add-unit-two-type-statistics.component';
+import { AddUnitTwoTypeDetailsComponent } from './addUnit/add-unit-two-type-details/add-unit-two-type-details.component';
+import { AddUnitTwoTimeComponent } from './addUnit/add-unit-two-time/add-unit-two-time.component';
const routes: Routes = [
{ path: 'statePageOne', component: PageOneComponent},
@@ -17,7 +24,14 @@ const routes: Routes = [
{ path: 'delete_two', component: DeleteTwoComponent},
{ path: 'delete_there', component: DeleteThereComponent},
{ path: 'delete_four', component: DeleteFourComponent},
- { path: 'buildingType_one', component: BuildingTypeOneComponent}
+ { path: 'buildingType_one', component: BuildingTypeOneComponent},
+ { path: 'buildingType_one/buildingType_two_forward', component: BuildingTypeTwoForwardComponent},
+ { path: 'buildingType_one/buildingType_two_reverse', component: BuildingTypeTwoReverseComponent},
+ { path: 'buildingType_one/buildingType_three_details', component: BuildingTypeThreeDetailsComponent},
+ { path: 'addUnit_one', component: AddUnitOneComponent},
+ { path: 'addUnit_one/addUnit_two_type', component: AddUnitTwoTypeStatisticsComponent},
+ { path: 'addUnit_one/addUnit_two_typeDetails', component: AddUnitTwoTypeDetailsComponent},
+ { path: 'addUnit_one/addUnit_two_time', component: AddUnitTwoTimeComponent},
];
@NgModule({
diff --git a/src/app/statistic-analysis/statistic-analysis.module.ts b/src/app/statistic-analysis/statistic-analysis.module.ts
index 1b226ed..74eded9 100644
--- a/src/app/statistic-analysis/statistic-analysis.module.ts
+++ b/src/app/statistic-analysis/statistic-analysis.module.ts
@@ -52,10 +52,17 @@ import { DeleteTwoComponent } from './deleteUnit/delete-two/delete-two.component
import { DeleteThereComponent } from './deleteUnit/delete-there/delete-there.component';
import { DeleteFourComponent } from './deleteUnit/delete-four/delete-four.component';
import { BuildingTypeOneComponent } from './buildingType/building-type-one/building-type-one.component';
+import { BuildingTypeTwoForwardComponent } from './buildingType/building-type-two-forward/building-type-two-forward.component';
+import { BuildingTypeTwoReverseComponent } from './buildingType/building-type-two-reverse/building-type-two-reverse.component';
+import { BuildingTypeThreeDetailsComponent } from './buildingType/building-type-three-details/building-type-three-details.component';
+import { AddUnitOneComponent } from './addUnit/add-unit-one/add-unit-one.component';
+import { AddUnitTwoTypeStatisticsComponent } from './addUnit/add-unit-two-type-statistics/add-unit-two-type-statistics.component';
+import { AddUnitTwoTypeDetailsComponent } from './addUnit/add-unit-two-type-details/add-unit-two-type-details.component';
+import { AddUnitTwoTimeComponent } from './addUnit/add-unit-two-time/add-unit-two-time.component';
@NgModule({
- declarations: [PageOneComponent, PageTwoTimeComponent, PageTwoNameComponent, PageZhongDuiDetailsComponent,echartsComponent, DeleteOneComponent, DeleteTwoComponent, DeleteThereComponent, DeleteFourComponent, BuildingTypeOneComponent],
+ declarations: [PageOneComponent, PageTwoTimeComponent, PageTwoNameComponent, PageZhongDuiDetailsComponent,echartsComponent, DeleteOneComponent, DeleteTwoComponent, DeleteThereComponent, DeleteFourComponent, BuildingTypeOneComponent, BuildingTypeTwoForwardComponent, BuildingTypeTwoReverseComponent, BuildingTypeThreeDetailsComponent, AddUnitOneComponent, AddUnitTwoTypeStatisticsComponent, AddUnitTwoTypeDetailsComponent, AddUnitTwoTimeComponent],
imports: [
CommonModule,
StatisticAnalysisRoutingModule,
From 27a8b4aa63beb3f307895ffc0ee0566b0ff3a60a Mon Sep 17 00:00:00 2001
From: SHAOJIAHAO <55341701@qq.com>
Date: Fri, 4 Sep 2020 13:49:47 +0800
Subject: [PATCH 4/7] =?UTF-8?q?[=E5=AE=8C=E5=96=84]=E4=BF=AE=E6=94=B9?=
=?UTF-8?q?=E6=8F=90=E7=A4=BA=E6=A1=86=E5=87=BD=E6=95=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../echarts-data.service.ts | 29 +++++++++++++++----
1 file changed, 24 insertions(+), 5 deletions(-)
diff --git a/src/app/statistic-analysis/echarts-data.service.ts b/src/app/statistic-analysis/echarts-data.service.ts
index d56c4c1..7774f89 100644
--- a/src/app/statistic-analysis/echarts-data.service.ts
+++ b/src/app/statistic-analysis/echarts-data.service.ts
@@ -29,7 +29,8 @@ export class EchartsDataService {
{name:"嘉定支队",number:"78",zhanbi:"0.6%"},
{name:"松江支队",number:"75",zhanbi:"0.5%"},
{name:"金山支队",number:"65",zhanbi:"0.4%"},
- {name:"崇明支队",number:"55",zhanbi:"0.3%"}
+ {name:"崇明支队",number:"55",zhanbi:"0.3%"},
+ {name:"总计",number:"1356",zhanbi:"19%"}
]
//中队提示框
tableDataZhong = [
@@ -48,7 +49,8 @@ export class EchartsDataService {
{name:"嘉定中队",number:"78",zhanbi:"0.6%"},
{name:"松江中队",number:"75",zhanbi:"0.5%"},
{name:"金山中队",number:"65",zhanbi:"0.4%"},
- {name:"崇明中队",number:"55",zhanbi:"0.3%"}
+ {name:"崇明中队",number:"55",zhanbi:"0.3%"},
+ {name:"总计",number:"1356",zhanbi:"19%"}
]
//建筑类型提示框
buildingType = [
@@ -67,7 +69,24 @@ export class EchartsDataService {
{name:"餐饮业",number:"78",zhanbi:"0.6%"},
{name:"影剧院",number:"75",zhanbi:"0.5%"},
{name:"展览建筑",number:"65",zhanbi:"0.4%"},
- {name:"隧道",number:"55",zhanbi:"0.3%"}
+ {name:"隧道",number:"55",zhanbi:"0.3%"},
+ {name:"总计",number:"1356",zhanbi:"19%"}
+ ]
+ //月份提示框
+ monthTooltip = [
+ {name:"一月",number:"156",zhanbi:"3%"},
+ {name:"二月",number:"144",zhanbi:"2.8%"},
+ {name:"三月",number:"133",zhanbi:"2.1%"},
+ {name:"四月",number:"122",zhanbi:"1.6%"},
+ {name:"五月",number:"120",zhanbi:"1.3%"},
+ {name:"六月",number:"100",zhanbi:"1.1%"},
+ {name:"七月",number:"95",zhanbi:"1%"},
+ {name:"八月",number:"90",zhanbi:"0.9%"},
+ {name:"九月",number:"88",zhanbi:"0.8%"},
+ {name:"十月",number:"83",zhanbi:"0.7%"},
+ {name:"十一月",number:"133",zhanbi:"2.1%"},
+ {name:"十二月",number:"122",zhanbi:"1.6%"},
+ {name:"总计",number:"984",zhanbi:"20%"}
]
//提示框表格
tableTooltip(dataArr,title:string){
@@ -88,7 +107,7 @@ export class EchartsDataService {
}
res+=''
- res+='总计 1356 19% '
+ // res+='总计 1356 19% '
res+='
计划更新
diff --git a/src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.scss b/src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.spec.ts b/src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.spec.ts new file mode 100644 index 0000000..76cc9b8 --- /dev/null +++ b/src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { ScheduledUpdatesComponent } from './scheduled-updates.component'; + +describe('ScheduledUpdatesComponent', () => { + let component: ScheduledUpdatesComponent; + let fixture: ComponentFixture'+biaotou+'
'
+ res+='| 名称 | '; + res+='数量 | ' + res+='总占比 | ' + res+=''+jsonObj[i].number+' | ' + res+=''+jsonObj[i].zhanbi+' | ' + } + + res+='总计 | 1356 | 19% | ' + res+='
+
\ No newline at end of file
diff --git a/src/app/statistic-analysis/addUnit/add-unit-two-time/add-unit-two-time.component.scss b/src/app/statistic-analysis/addUnit/add-unit-two-time/add-unit-two-time.component.scss
new file mode 100644
index 0000000..f17d954
--- /dev/null
+++ b/src/app/statistic-analysis/addUnit/add-unit-two-time/add-unit-two-time.component.scss
@@ -0,0 +1,63 @@
+.box{
+ width: 100%;
+ height: 92%;
+ display: flex;
+ flex-direction: column;
+ overflow: hidden;
+ position: relative;
+ .echartsbox{
+ width: 100%;
+ height: 100%;
+ overflow: auto;
+ }
+ #Line{
+ width: 50%;
+ height: 420px;
+ margin: 50px auto;
+ }
+}
+.publicCss{
+ height: 350px;
+ width: 50%;
+ display: inline-block;
+ box-sizing: border-box;
+ padding: 20px;
+}
+
+//头部搜索栏
+.header {
+ border-bottom: 1px solid #999;
+ height: 80px;
+ min-height: 81px;;
+ box-sizing: border-box;
+ // padding: 0 15px;
+ display: flex;
+ flex-direction: row;
+ flex-wrap: wrap;
+ align-items:center;
+ justify-content:center;
+ .queryField {
+ margin: 0 10px;
+ font-size: 14px;
+ .mat-form-field {
+ width: 130px;
+ max-height: 50px;;
+ margin: 0 15px 0 10px;
+ }
+ }
+ .btnbox{
+ height: 80px;
+ display: flex;
+ flex-direction:column;
+ justify-content: space-around;
+ position: fixed;
+ top: 64px;
+ right: 4%;
+ width: 88px;
+ button{
+ width: 88px;
+ height: 36px;
+ }
+
+ }
+ }
\ No newline at end of file
diff --git a/src/app/statistic-analysis/addUnit/add-unit-two-time/add-unit-two-time.component.spec.ts b/src/app/statistic-analysis/addUnit/add-unit-two-time/add-unit-two-time.component.spec.ts
new file mode 100644
index 0000000..929c56d
--- /dev/null
+++ b/src/app/statistic-analysis/addUnit/add-unit-two-time/add-unit-two-time.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AddUnitTwoTimeComponent } from './add-unit-two-time.component';
+
+describe('AddUnitTwoTimeComponent', () => {
+ let component: AddUnitTwoTimeComponent;
+ let fixture: ComponentFixture
+
+
+
+ 月
+ 年
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ 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
new file mode 100644
index 0000000..9246bae
--- /dev/null
+++ b/src/app/statistic-analysis/addUnit/add-unit-two-type-details/add-unit-two-type-details.component.scss
@@ -0,0 +1,42 @@
+.box{
+ width: 100%;
+ height: 92%;
+ display: flex;
+ flex-direction: column;
+ overflow: hidden;
+ position: relative;
+ .topbox{
+ width: 100%;
+ height: 80px;
+ min-height: 80px;
+ border-bottom: 1px gray solid;
+ .btnbox{
+ height: 80px;
+ display: flex;
+ flex-direction:column;
+ justify-content: space-around;
+ position: fixed;
+ top: 64px;
+ right: 4%;
+ width: 88px;
+ button{
+ width: 88px;
+ height: 36px;
+ }
+
+ }
+ }
+ .echartsbox{
+ width: 100%;
+ height: 100%;
+ overflow: auto;
+ #barEchart{
+ width: 100%;
+ height: 350px;
+ 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.spec.ts b/src/app/statistic-analysis/addUnit/add-unit-two-type-details/add-unit-two-type-details.component.spec.ts
new file mode 100644
index 0000000..1a550f1
--- /dev/null
+++ b/src/app/statistic-analysis/addUnit/add-unit-two-type-details/add-unit-two-type-details.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AddUnitTwoTypeDetailsComponent } from './add-unit-two-type-details.component';
+
+describe('AddUnitTwoTypeDetailsComponent', () => {
+ let component: AddUnitTwoTypeDetailsComponent;
+ let fixture: ComponentFixture
+
+
+
+
+
+
+
+
+
+
+ '+params.name+'
'
+ res+='| 名称 | '; + res+='数量 | ' + res+='总占比 | ' + res+=''+data[i].number+' | ' + res+=''+data[i].zhanbi+' | ' + } + + res+='总计 | 1356 | 19% | ' + res+='
+
\ No newline at end of file
diff --git a/src/app/statistic-analysis/addUnit/add-unit-two-type-statistics/add-unit-two-type-statistics.component.scss b/src/app/statistic-analysis/addUnit/add-unit-two-type-statistics/add-unit-two-type-statistics.component.scss
new file mode 100644
index 0000000..b9e1ac0
--- /dev/null
+++ b/src/app/statistic-analysis/addUnit/add-unit-two-type-statistics/add-unit-two-type-statistics.component.scss
@@ -0,0 +1,45 @@
+.box{
+ width: 100%;
+ height: 92%;
+ display: flex;
+ flex-direction: column;
+ overflow: hidden;
+ position: relative;
+ .topbox{
+ width: 100%;
+ height: 80px;
+ min-height: 80px;
+ border-bottom: 1px gray solid;
+ .btnbox{
+ height: 80px;
+ display: flex;
+ flex-direction:column;
+ justify-content: space-around;
+ position: fixed;
+ top: 64px;
+ right: 4%;
+ width: 88px;
+ button{
+ width: 88px;
+ height: 36px;
+ }
+
+ }
+ }
+ .echartsbox{
+ width: 100%;
+ height: 100%;
+ overflow: auto;
+ }
+ #pie{
+ width: 100%;
+ height: 450px;
+ }
+}
+.publicCss{
+ height: 350px;
+ width: 50%;
+ display: inline-block;
+ box-sizing: border-box;
+ padding: 20px;
+}
\ No newline at end of file
diff --git a/src/app/statistic-analysis/addUnit/add-unit-two-type-statistics/add-unit-two-type-statistics.component.spec.ts b/src/app/statistic-analysis/addUnit/add-unit-two-type-statistics/add-unit-two-type-statistics.component.spec.ts
new file mode 100644
index 0000000..475c178
--- /dev/null
+++ b/src/app/statistic-analysis/addUnit/add-unit-two-type-statistics/add-unit-two-type-statistics.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AddUnitTwoTypeStatisticsComponent } from './add-unit-two-type-statistics.component';
+
+describe('AddUnitTwoTypeStatisticsComponent', () => {
+ let component: AddUnitTwoTypeStatisticsComponent;
+ let fixture: ComponentFixture
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ '+title+'
'
+ res+='| 名称 | '; + res+='数量 | ' + res+='总占比 | ' + res+=''+data[i].number+' | ' + res+=''+data[i].zhanbi+' | ' + } + + res+='总计 | 1356 | 19% | ' + res+='
building-type-one works!
+ + + + \ No newline at end of file diff --git a/src/app/statistic-analysis/buildingType/building-type-one/building-type-one.component.scss b/src/app/statistic-analysis/buildingType/building-type-one/building-type-one.component.scss index e69de29..1bffad0 100644 --- a/src/app/statistic-analysis/buildingType/building-type-one/building-type-one.component.scss +++ b/src/app/statistic-analysis/buildingType/building-type-one/building-type-one.component.scss @@ -0,0 +1,8 @@ +.tishi{ + width: 100%; + height: 100%; + span{ + font-size: 25px; + text-align: center; + } +} \ No newline at end of file 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 b475080..867d366 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 @@ -1,5 +1,6 @@ import { Component, OnInit } from '@angular/core'; - +import { Router } from '@angular/router'; +declare var echarts: any; @Component({ selector: 'app-building-type-one', templateUrl: './building-type-one.component.html', @@ -7,9 +8,117 @@ import { Component, OnInit } from '@angular/core'; }) export class BuildingTypeOneComponent implements OnInit { - constructor() { } + constructor(private router: Router) { } ngOnInit(): void { + window.setTimeout(()=>{ + this.initCharts() + },0) + } + /* 首页饼状图 */ + initCharts(){ + let indexBzt = echarts.init(document.getElementById('indexBzt')); + let options={ + title: { + text: '建筑类型统计（8900家）', + left: 'center', + top: "7%", + textStyle: { + fontSize:31 + } + }, + tooltip: { + trigger: 'item', + formatter: (params)=>{ + return this.biaogeTishi(params.name) + }, + backgroundColor:'rgba(255,255,255,1)',//通过设置rgba调节背景颜色与透明度 + borderWidth:'1', + borderRadius :'0' + }, + legend: { + orient: 'vertical', + right: 150, + top:80, + data: ['高层', '地下', '轨道交通', '化工生产', '储罐类' , '厂房','古建筑', '商市场', '医院', '学校', '宾馆' , '娱乐场所','餐饮业', '影剧院', '展览建筑' , '隧道'] + }, + series: [ + { + name: '访问来源', + type: 'pie', + radius: '60%', + center: ['50%', '53%'], + label:{ + show:true, + fontSize:13, + formatter:'{b}{c}家\n{d|({d}%)}', + rich: { + d: { + align: 'center', + } + }, + }, + data: [ + {value: 500, name: '高层'}, + {value: 800, name: '地下'}, + {value: 900, name: '轨道交通'}, + {value: 800, name: '化工生产'}, + {value: 1200, name: '储罐类'}, + {value: 1500, name: '厂房'}, + {value: 1400, name: '古建筑'}, + {value: 600, name: '商市场'}, + {value: 568, name: '医院'}, + {value: 888, name: '学校'}, + {value: 485, name: '宾馆'}, + {value: 966, name: '娱乐场所'}, + {value: 789, name: '餐饮业'}, + {value: 500, name: '影剧院'}, + {value: 1025, name: '展览建筑'}, + {value: 600, name: '隧道'} + ], + emphasis: { + itemStyle: { + shadowBlur: 10, + shadowOffsetX: 0, + shadowColor: 'rgba(0, 0, 0, 0.5)' + } + } + } + ] + }; + indexBzt.on('click', (params) => { + this.router.navigateByUrl('/statisticanalysis/buildingType_one/buildingType_two_forward'); + }); + indexBzt.setOption(options); + } + biaogeTishi(biaotou:string){ + var shuju='[{"name":"浦东支队","number":"156","zhanbi":"3%"},{"name":"黄埔支队","number":"144","zhanbi":"2.8%"},' + shuju+='{"name":"徐汇支队","number":"133","zhanbi":"2.1%"},{"name":"长宁支队","number":"122","zhanbi":"1.6%"},' + shuju+='{"name":"静安支队","number":"120","zhanbi":"1.3%"},{"name":"普陀支队","number":"100","zhanbi":"1.1%"},' + shuju+='{"name":"虹口支队","number":"95","zhanbi":"1%"},{"name":"杨浦支队","number":"90","zhanbi":"0.9%"},' + shuju+='{"name":"闵行支队","number":"88","zhanbi":"0.8%"},{"name":"宝山支队","number":"83","zhanbi":"0.7%"},' + shuju+='{"name":"徐汇支队","number":"133","zhanbi":"2.1%"},{"name":"长宁支队","number":"122","zhanbi":"1.6%"},' + shuju+='{"name":"嘉定支队","number":"78","zhanbi":"0.6%"},{"name":"松江支队","number":"75","zhanbi":"0.5%"},' + shuju+='{"name":"金山支队","number":"65","zhanbi":"0.4%"},{"name":"崇明支队","number":"55","zhanbi":"0.3%"}]' + var jsonObj = JSON.parse(shuju); + var res = ''+biaotou+'
'
+ res+='| 名称 | '; + res+='数量 | ' + res+='总占比 | ' + res+=''+jsonObj[i].number+' | ' + res+=''+jsonObj[i].zhanbi+' | ' + } + + res+='总计 | 1356 | 19% | ' + res+='
+
\ No newline at end of file
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
new file mode 100644
index 0000000..98f42c4
--- /dev/null
+++ b/src/app/statistic-analysis/buildingType/building-type-three-details/building-type-three-details.component.scss
@@ -0,0 +1,38 @@
+.box{
+ width: 100%;
+ height: 92%;
+ display: flex;
+ flex-direction: column;
+ overflow: hidden;
+ position: relative;
+ .topbox{
+ width: 100%;
+ height: 80px;
+ border-bottom: 1px gray solid;
+ .btnbox{
+ display: flex;
+ flex-direction:column;
+ float: right;
+ justify-content: space-around;
+ height: 100%;
+ button{
+ width: 88px;
+ height: 36px;
+ }
+ margin-right:4%;
+ }
+ }
+ .echartsbox{
+ width: 100%;
+ height: 100%;
+ overflow: auto;
+ #barEchart{
+ width: 100%;
+ height: 350px;
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ transform: translate(-50%,-50%);
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/app/statistic-analysis/buildingType/building-type-three-details/building-type-three-details.component.spec.ts b/src/app/statistic-analysis/buildingType/building-type-three-details/building-type-three-details.component.spec.ts
new file mode 100644
index 0000000..93f7f44
--- /dev/null
+++ b/src/app/statistic-analysis/buildingType/building-type-three-details/building-type-three-details.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { BuildingTypeThreeDetailsComponent } from './building-type-three-details.component';
+
+describe('BuildingTypeThreeDetailsComponent', () => {
+ let component: BuildingTypeThreeDetailsComponent;
+ let fixture: ComponentFixture
+
+
+
+
+
+
+
+
+
+
+ '+params.name+'
'
+ res+='| 名称 | '; + res+='数量 | ' + res+='总占比 | ' + res+=''+data[i].number+' | ' + res+=''+data[i].zhanbi+' | ' + } + + res+='总计 | 1356 | 19% | ' + res+='
+
diff --git a/src/app/statistic-analysis/buildingType/building-type-two-forward/building-type-two-forward.component.scss b/src/app/statistic-analysis/buildingType/building-type-two-forward/building-type-two-forward.component.scss
new file mode 100644
index 0000000..6eac21d
--- /dev/null
+++ b/src/app/statistic-analysis/buildingType/building-type-two-forward/building-type-two-forward.component.scss
@@ -0,0 +1,41 @@
+.box{
+ width: 100%;
+ height: 92%;
+ display: flex;
+ flex-direction: column;
+ overflow: hidden;
+ position: relative;
+ .topbox{
+ width: 100%;
+ height: 80px;
+ border-bottom: 1px gray solid;
+ .btnbox{
+ display: flex;
+ flex-direction:column;
+ float: right;
+ justify-content: space-around;
+ height: 100%;
+ button{
+ width: 88px;
+ height: 36px;
+ }
+ margin-right:4%;
+ }
+ }
+ .echartsbox{
+ width: 100%;
+ height: 100%;
+ overflow: auto;
+ }
+ #pie{
+ width: 100%;
+ height: 450px;
+ }
+}
+.publicCss{
+ height: 350px;
+ width: 50%;
+ display: inline-block;
+ box-sizing: border-box;
+ padding: 20px;
+}
diff --git a/src/app/statistic-analysis/buildingType/building-type-two-forward/building-type-two-forward.component.spec.ts b/src/app/statistic-analysis/buildingType/building-type-two-forward/building-type-two-forward.component.spec.ts
new file mode 100644
index 0000000..f09fbfd
--- /dev/null
+++ b/src/app/statistic-analysis/buildingType/building-type-two-forward/building-type-two-forward.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { BuildingTypeTwoForwardComponent } from './building-type-two-forward.component';
+
+describe('BuildingTypeTwoForwardComponent', () => {
+ let component: BuildingTypeTwoForwardComponent;
+ let fixture: ComponentFixture
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ '+title+'
'
+ res+='| 名称 | '; + res+='数量 | ' + res+='总占比 | ' + res+=''+data[i].number+' | ' + res+=''+data[i].zhanbi+' | ' + } + + res+='总计 | 1356 | 19% | ' + res+='
+
\ No newline at end of file
diff --git a/src/app/statistic-analysis/buildingType/building-type-two-reverse/building-type-two-reverse.component.scss b/src/app/statistic-analysis/buildingType/building-type-two-reverse/building-type-two-reverse.component.scss
new file mode 100644
index 0000000..339f54b
--- /dev/null
+++ b/src/app/statistic-analysis/buildingType/building-type-two-reverse/building-type-two-reverse.component.scss
@@ -0,0 +1,41 @@
+.box{
+ width: 100%;
+ height: 92%;
+ display: flex;
+ flex-direction: column;
+ overflow: hidden;
+ position: relative;
+ .topbox{
+ width: 100%;
+ height: 80px;
+ border-bottom: 1px gray solid;
+ .btnbox{
+ display: flex;
+ flex-direction:column;
+ float: right;
+ justify-content: space-around;
+ height: 100%;
+ button{
+ width: 88px;
+ height: 36px;
+ }
+ margin-right:4%;
+ }
+ }
+ .echartsbox{
+ width: 100%;
+ height: 100%;
+ overflow: auto;
+ }
+ #pie{
+ width: 100%;
+ height: 450px;
+ }
+}
+.publicCss{
+ height: 350px;
+ width: 50%;
+ display: inline-block;
+ box-sizing: border-box;
+ padding: 20px;
+}
\ No newline at end of file
diff --git a/src/app/statistic-analysis/buildingType/building-type-two-reverse/building-type-two-reverse.component.spec.ts b/src/app/statistic-analysis/buildingType/building-type-two-reverse/building-type-two-reverse.component.spec.ts
new file mode 100644
index 0000000..5e3f000
--- /dev/null
+++ b/src/app/statistic-analysis/buildingType/building-type-two-reverse/building-type-two-reverse.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { BuildingTypeTwoReverseComponent } from './building-type-two-reverse.component';
+
+describe('BuildingTypeTwoReverseComponent', () => {
+ let component: BuildingTypeTwoReverseComponent;
+ let fixture: ComponentFixture
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ '+title+'
'
+ res+='| 名称 | '; + res+='数量 | ' + res+='总占比 | ' + res+=''+data[i].number+' | ' + res+=''+data[i].zhanbi+' | ' + } + + res+='总计 | 1356 | 19% | ' + res+='
'+title+'
'
+ res+='| 名称 | '; + res+='数量 | ' + res+='总占比 | ' + res+=''+data[i].number+' | ' + res+=''+data[i].zhanbi+' | ' + } + + res+='总计 | 1356 | 19% | ' + res+='
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/app/statistic-analysis/scheduled-updates/publicEcharts.html b/src/app/statistic-analysis/scheduled-updates/publicEcharts.html
new file mode 100644
index 0000000..de7dc90
--- /dev/null
+++ b/src/app/statistic-analysis/scheduled-updates/publicEcharts.html
@@ -0,0 +1,25 @@
+
+
+
diff --git a/src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.html b/src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.html
index e5a8cee..1f2f2b9 100644
--- a/src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.html
+++ b/src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.html
@@ -1 +1,3 @@
-
+
+
+
+
+
+
+ 公告:
+浦东支队1月份已核查案件高于平均值;黄浦支队1月份已核查案件高于平均值...
+ +
+
+
+
+
+
+
+
+
+
+ 计划更新
+
+
+
diff --git a/src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.scss b/src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.scss
index e69de29..12d4423 100644
--- a/src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.scss
+++ b/src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.scss
@@ -0,0 +1,11 @@
+.content {
+ width: 100%;
+ height: 93%;
+ overflow: hidden;
+ box-sizing: border-box;
+ padding: 10px 10px 20px 10px;
+ .center {
+ width: 100%;
+ height: 100%;
+ }
+}
\ No newline at end of file
diff --git a/src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.ts b/src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.ts
index fb946f6..3898241 100644
--- a/src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.ts
+++ b/src/app/statistic-analysis/scheduled-updates/scheduled-updates.component.ts
@@ -1,4 +1,8 @@
import { Component, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
+import {EchartsDataService} from '../echarts-data.service'
+import { MatDialog } from '@angular/material/dialog';
+declare var echarts: any;
@Component({
selector: 'app-scheduled-updates',
@@ -7,9 +11,738 @@ import { Component, OnInit } from '@angular/core';
})
export class ScheduledUpdatesComponent implements OnInit {
- constructor() { }
+ constructor(private router: Router) { }
ngOnInit(): void {
+ window.setTimeout(()=>{
+ this.initCharts()
+ })
}
+ /* 首页饼状图 */
+ initCharts(){
+ var indexBzt = echarts.init(document.getElementById('center'));
+ var options={
+ title: {
+ text: '计划更新统计（7100家）',
+ padding:[80,100],
+ left: 'center',
+ textStyle:{
+ fontSize:34
+ }
+ },
+ tooltip: {
+ trigger: 'item',
+ formatter: (params)=>{
+ // return this.biaogeTishi(params.name)
+ } ,
+ backgroundColor:'rgba(255,255,255,1)',//通过设置rgba调节背景颜色与透明度
+ borderWidth:'1',
+ borderRadius :'0'
+ },
+ legend: {
+ orient: 'vertical',
+ right: 150,
+ top:80,
+ itemWidth:60,
+ itemHeight:25,
+ textStyle:{
+ fontSize:28
+ },
+ data: ['已核查无需修改', '已核查修改中', '已核查提交审核', '未核查']
+ },
+ series: [{
+ name: '访问来源',
+ type: 'pie',
+ radius: '65%',
+ center: ['50%', '60%'],
+ label:{
+ normal:{
+ show:true,
+ position: 'inner',
+ fontSize:18,
+ formatter:'{d}% ({c}家)'
+ }},
+ data: [
+ {value: 2000, name: '已核查无需修改'},
+ {value: 2500, name: '已核查修改中',itemStyle:{color:'#02A7F0'}},
+ {value: 1900, name: '已核查提交审核',itemStyle:{color:'#87cebb'}},
+ {value: 700, name: '未核查'},],
+ emphasis: {
+ itemStyle: {
+ shadowBlur: 10,
+ shadowOffsetX: 0,
+ shadowColor: 'rgba(0, 0, 0, 0.5)'
+ }
+ }
+
+ }]
+ };
+ indexBzt.setOption(options);
+ indexBzt.on('click', (params) => {
+ this.router.navigateByUrl('/statisticanalysis/scheduledUpdates/PublicEcharts');
+ });
+ }
+
+
+
+}
+
+@Component({
+ selector: 'app-publicEcharts',
+ templateUrl: './publicEcharts.html',
+ styleUrls: ['../state/page-two-time/page-two-time.component.scss']
+})
+export class publicEchartsComponent implements OnInit {
+
+ constructor(private router: Router,public echartsData:EchartsDataService,public dialog: MatDialog,) { }
+
+ ngOnInit(): void {
+
+ }
+
+ isToggle:boolean = true; // 已核查/未核查
+
+ //已核查
+ verified () {
+ this.isToggle = true
+ this.echartsData.scheduledUpdatesToggle = true
+ }
+
+ //未核查
+ notVerified () {
+ this.isToggle = false
+ this.echartsData.scheduledUpdatesToggle = true
+ }
+
+ //更多 窗口
+ moreOpen () {
+ let dialogRef = this.dialog.open(moreTableComponent);
+ }
+
+
+
}
+
+
+
+//已核查组件
+@Component({
+ selector: 'app-verified',
+ templateUrl: './verified.html',
+ styleUrls: ['../state/page-two-time/page-two-time.component.scss']
+})
+export class verifiedComponent implements OnInit {
+
+ constructor(private router: Router,public echartsData:EchartsDataService) { }
+
+ ngOnInit(): void {
+ window.setTimeout(()=>{
+ this.oneInit()
+ this.twoInit()
+ },0)
+ }
+
+ ngOnDestroy () {
+ this.oneEcharts.clear()
+ this.items.forEach((element,index) => {
+ element.echart.clear()
+ });
+ }
+
+ oneEcharts:any;
+ oneInit () {
+ this.oneEcharts = echarts.init(document.getElementById('center'), 'skinUpp');
+ var option = {
+ grid: {
+ top: 50,
+ left:40,
+ right: 20,
+ bottom: 20,
+ },
+ // 标题
+ title: {
+ text: '已核查',
+ top: -4,
+ left: 'center',
+ textStyle:{
+ //文字颜色
+ color:'#000',
+ fontSize: 22,
+ }
+ },
+ //提示框
+ tooltip: {
+ trigger: 'axis',
+ },
+ // x轴
+ xAxis: {
+ type: 'category',
+ data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月','9月','10月','11月','12月'],
+ boundaryGap: false,
+ axisLabel: {
+ color: "#000", //刻度线标签颜色
+ },
+ //设置坐标轴字体颜色和宽度
+ axisLine: {
+ lineStyle: {
+ color: "#000",
+ },
+ },
+ splitLine: {//分割线配置
+ show:true,
+ lineStyle: {
+ color: '#999',
+ }
+ }
+ },
+ // y轴
+ yAxis: {
+ type: 'value',
+ name: '个',
+ axisLabel: {
+ color: "#000" //刻度线标签颜色
+ },
+ //设置坐标轴字体颜色和宽度
+ axisLine: {
+ lineStyle: {
+ color: "#000",
+ }
+ }
+ },
+ // 数据
+ series: [{
+ name: '单位预案编制数量',
+ type: 'line',
+ data: [1170, 953, 1144, 799, 789, 773, 660, 998, 790, 1004, 1345, 1245],
+ }
+ ],
+ };
+ this.oneEcharts.setOption(option);
+ }
+
+ months:any = ['一月','二月','三月','四月','五月','六月','七月','八月','九月','十月','十一月','十二月']
+ echartIds:any = ['one','two','three','four','five','six','seven','eight','nine','ten','eleven','twelve']
+ items:any = [{echart:null},{echart:null},{echart:null},{echart:null},{echart:null},{echart:null},{echart:null},{echart:null},{echart:null},{echart:null},{echart:null},{echart:null}]
+
+ twoInit () {
+ this.months.forEach((element,index) => {
+ this.items[index].echart = echarts.init(document.getElementById(this.echartIds[index]), 'skinUpp');
+ var option = {
+ title: {
+ text: element,
+ top: -4,
+ left: 'center',
+ textStyle:{
+ color:'#000',
+ fontSize: 18,
+ }
+ },
+ //提示框
+ tooltip: {
+ trigger: 'axis',
+ },
+ legend: {
+ data: ['平均值','平均值2倍','平均值3倍', '已核查无需修改', '已核查修改中', '已核查提交审核'],
+ textStyle: { color: '#000' }
+ },
+ xAxis: [{
+ axisLabel: {
+ color: "#000", //刻度线标签颜色
+ },
+ //设置坐标轴字体颜色和宽度
+ axisLine: {
+ lineStyle: {color: "#000",}
+ },
+ type: 'category',
+ data: ['浦东支队','黄浦支队','徐汇支队','长宁支队','静安支队','普陀支队','虹口支队','杨浦支队','闵行支队','宝山支队','嘉定支队','崇明支队','金山支队'],
+ axisPointer: {type: 'shadow'}
+ }],
+ yAxis: [
+ {
+ //设置坐标轴字体颜色和宽度
+ axisLine: {
+ lineStyle: {color: "#000"},
+ },
+ type: 'value',
+ name: '个',
+ axisLabel: {
+ color: "#000", //刻度线标签颜色
+ formatter: '{value}'
+ }
+ },
+ {
+ //设置坐标轴字体颜色和宽度
+ axisLine: {
+ lineStyle: {color: "#000"},
+ },
+ type: 'value',
+ name: '个',
+ axisLabel: {
+ color: "#000", //刻度线标签颜色
+ formatter: '{value}'
+ }
+ }
+ ],
+ series: [
+ {
+ name: '已核查无需修改',
+ type: 'bar',
+ data: [68, 56, 69, 57, 43, 79, 78, 66, 49, 34, 49, 78, 45],
+ },
+ {
+ name: '已核查修改中',
+ type: 'bar',
+ data: [39, 43, 49, 27, 53, 29, 38, 49, 29, 40, 40, 27, 54],
+ itemStyle:{color: '#DC143C'}
+ },
+ {
+ name: '已核查提交审核',
+ type: 'bar',
+ data: [48, 42, 43, 53, 47, 39, 25, 26, 54, 34, 39, 24, 14],
+ itemStyle:{color:'#00BB00'}
+ },
+ {
+ name: '平均值',
+ type: 'line',
+ yAxisIndex: 1,
+ data: [49, 45, 53, 47, 49, 43, 48, 41, 38, 39, 41, 43, 37],
+ itemStyle:{color: '#FFDC35'}
+ },
+ {
+ name: '平均值2倍',
+ type: 'line',
+ yAxisIndex: 1,
+ data: [98, 90, 106, 94, 98, 86, 96, 82, 76, 78, 82, 86, 74],
+ itemStyle:{color: '#FF00FF'}
+ },
+ {
+ name: '平均值3倍',
+ type: 'line',
+ yAxisIndex: 1,
+ data: [143, 135, 159, 143, 127, 144, 144, 123, 114, 117, 124, 129, 111],
+ itemStyle:{color: '#999'}
+ },
+ ]
+ };
+ this.items[index].echart.setOption(option);
+ this.items[index].echart.on('click', (params) => {
+ this.echartsData.scheduledUpdatesType = 0
+ this.echartsData.scheduledUpdatesName = this.months[index]
+ this.echartsData.scheduledUpdatesToggle = false
+ });
+ });
+ }
+
+
+
+}
+
+
+
+//未核查组件
+@Component({
+ selector: 'app-notVerified',
+ templateUrl: './notVerified.html',
+ styleUrls: ['../state/page-two-time/page-two-time.component.scss']
+})
+export class notVerifiedComponent implements OnInit {
+
+ constructor(private router: Router,public echartsData:EchartsDataService) { }
+
+ ngOnInit(): void {
+ window.setTimeout(()=>{
+ this.oneInit()
+ this.twoInit()
+ },0)
+ }
+
+ ngOnDestroy () {
+ this.oneEcharts.clear()
+ this.items.forEach((element,index) => {
+ element.echart.clear()
+ });
+ }
+
+ oneEcharts:any;
+ oneInit () {
+ this.oneEcharts = echarts.init(document.getElementById('center'), 'skinUpp');
+ var option = {
+ grid: {
+ top: 50,
+ left:40,
+ right: 20,
+ bottom: 20,
+ },
+ // 标题
+ title: {
+ text: '未核查',
+ top: -4,
+ left: 'center',
+ textStyle:{
+ //文字颜色
+ color:'#000',
+ fontSize: 22,
+ }
+ },
+ //提示框
+ tooltip: {
+ trigger: 'axis',
+ },
+ // x轴
+ xAxis: {
+ type: 'category',
+ data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月','9月','10月','11月','12月'],
+ boundaryGap: false,
+ axisLabel: {
+ color: "#000", //刻度线标签颜色
+ },
+ //设置坐标轴字体颜色和宽度
+ axisLine: {
+ lineStyle: {
+ color: "#000",
+ },
+ },
+ splitLine: {//分割线配置
+ show:true,
+ lineStyle: {
+ color: '#999',
+ }
+ }
+ },
+ // y轴
+ yAxis: {
+ type: 'value',
+ name: '个',
+ axisLabel: {
+ color: "#000" //刻度线标签颜色
+ },
+ //设置坐标轴字体颜色和宽度
+ axisLine: {
+ lineStyle: {
+ color: "#000",
+ }
+ }
+ },
+ // 数据
+ series: [{
+ name: '单位预案编制数量',
+ type: 'line',
+ data: [1245, 1345, 1004, 790, 998, 660, 773, 789, 799, 1144, 953, 1170,],
+ }
+ ],
+ };
+ this.oneEcharts.setOption(option);
+ }
+
+ months:any = ['一月','二月','三月','四月','五月','六月','七月','八月','九月','十月','十一月','十二月']
+ echartIds:any = ['one','two','three','four','five','six','seven','eight','nine','ten','eleven','twelve']
+ items:any = [{echart:null},{echart:null},{echart:null},{echart:null},{echart:null},{echart:null},{echart:null},{echart:null},{echart:null},{echart:null},{echart:null},{echart:null}]
+
+ twoInit () {
+ this.months.forEach((element,index) => {
+ this.items[index].echart = echarts.init(document.getElementById(this.echartIds[index]), 'skinUpp');
+ var option = {
+ title: {
+ text: element,
+ top: -4,
+ left: 'center',
+ textStyle:{
+ color:'#000',
+ fontSize: 18,
+ }
+ },
+ //提示框
+ tooltip: {
+ trigger: 'axis',
+ },
+ legend: {
+ data: ['未核查'],
+ textStyle: { color: '#000' }
+ },
+ xAxis: [{
+ axisLabel: {
+ color: "#000", //刻度线标签颜色
+ interval: 0,
+ formatter:function(value){
+ var ret = "";//拼接加\n返回的类目项
+ var maxLength = 2;//每项显示文字个数
+ 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;
+ }
+ } //function
+ },
+ //设置坐标轴字体颜色和宽度
+ axisLine: {
+ lineStyle: {color: "#000",}
+ },
+ type: 'category',
+ data: ['浦东支队','黄浦支队','徐汇支队','长宁支队','静安支队','普陀支队','虹口支队','杨浦支队','闵行支队','宝山支队','嘉定支队','崇明支队','金山支队'],
+ axisPointer: {type: 'shadow'}
+ }],
+ yAxis: [
+ {
+ //设置坐标轴字体颜色和宽度
+ axisLine: {
+ lineStyle: {color: "#000"},
+ },
+ type: 'value',
+ name: '个',
+ axisLabel: {
+ color: "#000", //刻度线标签颜色
+ formatter: '{value}'
+ }
+ }
+ ],
+ series: [
+ {
+ name: '未核查',
+ type: 'bar',
+ data: [48, 36, 49, 37, 33, 59, 58, 46, 39, 34, 39, 68, 45],
+ },
+ ]
+ };
+ this.items[index].echart.setOption(option);
+ this.items[index].echart.on('click', (params) => {
+ this.echartsData.scheduledUpdatesType = 1
+ this.echartsData.scheduledUpdatesName = this.months[index]
+ this.echartsData.scheduledUpdatesToggle = false
+ });
+ });
+ }
+
+
+
+}
+
+
+
+//echarts详情组件
+@Component({
+ selector: 'app-detailedInformation',
+ templateUrl: './detailedInformation.html',
+ styleUrls: ['../state/page-two-time/page-two-time.component.scss']
+})
+export class detailedInformationComponent implements OnInit {
+
+ constructor(private router: Router,public echartsData:EchartsDataService) { }
+
+ ngOnInit(): void {
+ window.setTimeout(()=>{
+ this.oneInit()
+ },0)
+ }
+
+ oneInit () {
+ let echart = echarts.init(document.getElementById('center'), 'skinUpp');
+ if (this.echartsData.scheduledUpdatesType ===0) { //已核查
+ var option = {
+ title: {
+ text: this.echartsData.scheduledUpdatesName,
+ top: -4,
+ left: 'center',
+ textStyle:{
+ color:'#000',
+ fontSize: 18,
+ }
+ },
+ //提示框
+ tooltip: {
+ trigger: 'axis',
+ },
+ legend: {
+ data: ['平均值','平均值2倍','平均值3倍', '已核查无需修改', '已核查修改中', '已核查提交审核'],
+ textStyle: { color: '#000' }
+ },
+ xAxis: [{
+ axisLabel: {
+ color: "#000", //刻度线标签颜色
+ },
+ //设置坐标轴字体颜色和宽度
+ axisLine: {
+ lineStyle: {color: "#000",}
+ },
+ type: 'category',
+ data: ['浦东支队','黄浦支队','徐汇支队','长宁支队','静安支队','普陀支队','虹口支队','杨浦支队','闵行支队','宝山支队','嘉定支队','崇明支队','金山支队'],
+ axisPointer: {type: 'shadow'}
+ }],
+ yAxis: [
+ {
+ //设置坐标轴字体颜色和宽度
+ axisLine: {
+ lineStyle: {color: "#000"},
+ },
+ type: 'value',
+ name: '个',
+ axisLabel: {
+ color: "#000", //刻度线标签颜色
+ formatter: '{value}'
+ }
+ },
+ {
+ //设置坐标轴字体颜色和宽度
+ axisLine: {
+ lineStyle: {color: "#000"},
+ },
+ type: 'value',
+ name: '个',
+ axisLabel: {
+ color: "#000", //刻度线标签颜色
+ formatter: '{value}'
+ }
+ }
+ ],
+ series: [
+ {
+ name: '已核查无需修改',
+ type: 'bar',
+ data: [68, 56, 69, 57, 43, 79, 78, 66, 49, 34, 49, 78, 45],
+ },
+ {
+ name: '已核查修改中',
+ type: 'bar',
+ data: [39, 43, 49, 27, 53, 29, 38, 49, 29, 40, 40, 27, 54],
+ itemStyle:{color: '#DC143C'}
+ },
+ {
+ name: '已核查提交审核',
+ type: 'bar',
+ data: [48, 42, 43, 53, 47, 39, 25, 26, 54, 34, 39, 24, 14],
+ itemStyle:{color:'#00BB00'}
+ },
+ {
+ name: '平均值',
+ type: 'line',
+ yAxisIndex: 1,
+ data: [49, 45, 53, 47, 49, 43, 48, 41, 38, 39, 41, 43, 37],
+ itemStyle:{color: '#FFDC35'}
+ },
+ {
+ name: '平均值2倍',
+ type: 'line',
+ yAxisIndex: 1,
+ data: [98, 90, 106, 94, 98, 86, 96, 82, 76, 78, 82, 86, 74],
+ itemStyle:{color: '#FF00FF'}
+ },
+ {
+ name: '平均值3倍',
+ type: 'line',
+ yAxisIndex: 1,
+ data: [143, 135, 159, 143, 127, 144, 144, 123, 114, 117, 124, 129, 111],
+ itemStyle:{color: '#999'}
+ },
+ ]
+ };
+ echart.setOption(option);
+ } else { //未核查
+ var options = {
+ title: {
+ text: this.echartsData.scheduledUpdatesName,
+ top: -4,
+ left: 'center',
+ textStyle:{
+ color:'#000',
+ fontSize: 18,
+ }
+ },
+ //提示框
+ tooltip: {
+ trigger: 'axis',
+ },
+ legend: {
+ data: ['未核查'],
+ textStyle: { color: '#000' }
+ },
+ xAxis: [{
+ axisLabel: {
+ color: "#000", //刻度线标签颜色
+ interval: 0,
+ formatter:function(value){
+ var ret = "";//拼接加\n返回的类目项
+ var maxLength = 2;//每项显示文字个数
+ 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;
+ }
+ } //function
+ },
+ //设置坐标轴字体颜色和宽度
+ axisLine: {
+ lineStyle: {color: "#000",}
+ },
+ type: 'category',
+ data: ['浦东支队','黄浦支队','徐汇支队','长宁支队','静安支队','普陀支队','虹口支队','杨浦支队','闵行支队','宝山支队','嘉定支队','崇明支队','金山支队'],
+ axisPointer: {type: 'shadow'}
+ }],
+ yAxis: [
+ {
+ //设置坐标轴字体颜色和宽度
+ axisLine: {
+ lineStyle: {color: "#000"},
+ },
+ type: 'value',
+ name: '个',
+ axisLabel: {
+ color: "#000", //刻度线标签颜色
+ formatter: '{value}'
+ }
+ }
+ ],
+ series: [
+ {
+ name: '未核查',
+ type: 'bar',
+ data: [48, 36, 49, 37, 33, 59, 58, 46, 39, 34, 39, 68, 45],
+ },
+ ]
+ };
+ echart.setOption(options);
+ }
+ }
+
+
+
+}
+
+
+
+//更多资讯组件
+@Component({
+ selector: 'app-moreTable',
+ templateUrl: './moreTable.html',
+ styleUrls: ['./scheduled-updates.component.scss']
+})
+export class moreTableComponent implements OnInit {
+
+ constructor(private router: Router,public echartsData:EchartsDataService) { }
+
+ ngOnInit(): void {
+
+ }
+
+
+
+}
\ No newline at end of file
diff --git a/src/app/statistic-analysis/scheduled-updates/verified.html b/src/app/statistic-analysis/scheduled-updates/verified.html
new file mode 100644
index 0000000..acace8e
--- /dev/null
+++ b/src/app/statistic-analysis/scheduled-updates/verified.html
@@ -0,0 +1,16 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/app/statistic-analysis/state/page-two-time/page-two-time.component.scss b/src/app/statistic-analysis/state/page-two-time/page-two-time.component.scss
index 5bbff55..72fe17c 100644
--- a/src/app/statistic-analysis/state/page-two-time/page-two-time.component.scss
+++ b/src/app/statistic-analysis/state/page-two-time/page-two-time.component.scss
@@ -21,6 +21,7 @@
.header {
border-bottom: 1px solid #999;
height: 70px;
+ min-height: 70px;
box-sizing: border-box;
padding: 0 15px;
display: flex;
@@ -50,7 +51,15 @@
width: 50%;
display: inline-block;
box-sizing: border-box;
- padding: 20px;
+ padding: 10px;
+ margin: 10px 0;
+}
+.publicOneLineCss{
+ height: 350px;
+ width: 90%;
+ margin: 10px auto;
+ box-sizing: border-box;
+ padding: 10px;
}
//滚动条样式
diff --git a/src/app/statistic-analysis/statistic-analysis-routing.module.ts b/src/app/statistic-analysis/statistic-analysis-routing.module.ts
index 4ac378c..a8ac4a6 100644
--- a/src/app/statistic-analysis/statistic-analysis-routing.module.ts
+++ b/src/app/statistic-analysis/statistic-analysis-routing.module.ts
@@ -9,7 +9,7 @@ import { DeleteTwoComponent } from './deleteUnit/delete-two/delete-two.component
import { DeleteThereComponent } from './deleteUnit/delete-there/delete-there.component';
import { DeleteFourComponent } from './deleteUnit/delete-four/delete-four.component';
import { BuildingTypeOneComponent } from './buildingType/building-type-one/building-type-one.component';
-import {ScheduledUpdatesComponent} from './scheduled-updates/scheduled-updates.component'
+import {ScheduledUpdatesComponent,publicEchartsComponent} from './scheduled-updates/scheduled-updates.component'
const routes: Routes = [
{ path: 'statePageOne', component: PageOneComponent},
@@ -19,7 +19,8 @@ const routes: Routes = [
{ path: 'delete_there', component: DeleteThereComponent},
{ path: 'delete_four', component: DeleteFourComponent},
{ path: 'buildingType_one', component: BuildingTypeOneComponent},
- { path: 'scheduledUpdates', component: ScheduledUpdatesComponent}
+ { path: 'scheduledUpdates', component: ScheduledUpdatesComponent},
+ { path: 'scheduledUpdates/PublicEcharts', component: publicEchartsComponent}
];
@NgModule({
diff --git a/src/app/statistic-analysis/statistic-analysis.module.ts b/src/app/statistic-analysis/statistic-analysis.module.ts
index fbfec50..354c854 100644
--- a/src/app/statistic-analysis/statistic-analysis.module.ts
+++ b/src/app/statistic-analysis/statistic-analysis.module.ts
@@ -52,11 +52,11 @@ import { DeleteTwoComponent } from './deleteUnit/delete-two/delete-two.component
import { DeleteThereComponent } from './deleteUnit/delete-there/delete-there.component';
import { DeleteFourComponent } from './deleteUnit/delete-four/delete-four.component';
import { BuildingTypeOneComponent } from './buildingType/building-type-one/building-type-one.component';
-import { ScheduledUpdatesComponent } from './scheduled-updates/scheduled-updates.component';
+import { ScheduledUpdatesComponent,publicEchartsComponent,verifiedComponent,notVerifiedComponent,detailedInformationComponent,moreTableComponent } from './scheduled-updates/scheduled-updates.component';
@NgModule({
- declarations: [PageOneComponent, PageTwoTimeComponent, PageTwoNameComponent, PageZhongDuiDetailsComponent,echartsComponent, DeleteOneComponent, DeleteTwoComponent, DeleteThereComponent, DeleteFourComponent, BuildingTypeOneComponent, ScheduledUpdatesComponent],
+ declarations: [PageOneComponent, PageTwoTimeComponent, PageTwoNameComponent, PageZhongDuiDetailsComponent,echartsComponent, DeleteOneComponent, DeleteTwoComponent, DeleteThereComponent, DeleteFourComponent, BuildingTypeOneComponent, ScheduledUpdatesComponent,publicEchartsComponent,verifiedComponent,notVerifiedComponent,detailedInformationComponent,moreTableComponent],
imports: [
CommonModule,
StatisticAnalysisRoutingModule,
From 3d10c8caf462e620609a565d5167b544221652a6 Mon Sep 17 00:00:00 2001
From: cpf <1105965053@qq.com>
Date: Fri, 4 Sep 2020 14:42:40 +0800
Subject: [PATCH 6/7] =?UTF-8?q?[=E5=AE=8C=E5=96=84]=20=E5=A2=9E=E5=8A=A0?=
=?UTF-8?q?=E5=88=87=E6=8D=A2=E6=8C=89=E9=92=AE=E9=80=89=E4=B8=AD=E6=A0=B7?=
=?UTF-8?q?=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/app/statistic-analysis/echarts-data.service.ts | 1 +
.../statistic-analysis/scheduled-updates/publicEcharts.html | 4 ++--
.../state/page-two-time/page-two-time.component.html | 4 ++--
.../state/page-two-time/page-two-time.component.scss | 6 ++++++
4 files changed, 11 insertions(+), 4 deletions(-)
diff --git a/src/app/statistic-analysis/echarts-data.service.ts b/src/app/statistic-analysis/echarts-data.service.ts
index 19f1184..3fe81f8 100644
--- a/src/app/statistic-analysis/echarts-data.service.ts
+++ b/src/app/statistic-analysis/echarts-data.service.ts
@@ -17,6 +17,7 @@ export class EchartsDataService {
scheduledUpdatesToggle:boolean = true; // 显示 当前点击 已核查/未核查
+
//支队提示框
tableDataZhi = [
{name:"浦东支队",number:"156",zhanbi:"3%"},
diff --git a/src/app/statistic-analysis/scheduled-updates/publicEcharts.html b/src/app/statistic-analysis/scheduled-updates/publicEcharts.html
index de7dc90..63e86bd 100644
--- a/src/app/statistic-analysis/scheduled-updates/publicEcharts.html
+++ b/src/app/statistic-analysis/scheduled-updates/publicEcharts.html
@@ -9,8 +9,8 @@