Browse Source

[新增]echarts天津地图

tianjin
邵佳豪 2 years ago
parent
commit
6716f69161
  1. 19467
      package-lock.json
  2. 2
      package.json
  3. 250
      src/app/pages/login/login.component.ts
  4. 13
      src/app/plan-audit/plan-record/plan-record.component.ts
  5. 61
      src/app/plan-audit/wait-examineer/wait-examineer.component.ts
  6. 7
      src/app/statistic-analysis/home/home.component.html
  7. 1
      src/app/statistic-analysis/home/home.component.scss
  8. 661
      src/app/statistic-analysis/home/home.component.ts
  9. 19
      src/assets/echarts/tianjin.js
  10. 1
      src/assets/echarts/tianjin.json
  11. 4
      src/index.html
  12. 19
      tsconfig.json
  13. 943
      yarn.lock

19467
package-lock.json generated

File diff suppressed because it is too large Load Diff

2
package.json

@ -32,7 +32,7 @@
"cesium": "^1.64.0",
"crypto-js": "^4.0.0",
"e-ngx-cesium": "^6.3.2",
"echarts": "^4.6.0",
"echarts": "^4.1.0",
"firebase": "^7.6.2",
"ng-zorro-antd": "^9.3.0",
"ng2-file-upload": "^1.4.0",

250
src/app/pages/login/login.component.ts

@ -1,188 +1,204 @@
import { ApplicationRef, Component, ComponentFactoryResolver, Injector, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http'
import { Data } from '../../interface'
import { Router, ActivatedRoute } from '@angular/router'
import { CacheTokenService } from '../../http-interceptors/cache-token.service'//引入服务
import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar';
import { MatDialog, MatDialogRef } from '@angular/material/dialog';
import {
ApplicationRef,
Component,
ComponentFactoryResolver,
Injector,
OnInit,
} from "@angular/core";
import { HttpClient } from "@angular/common/http";
import { Data } from "../../interface";
import { Router, ActivatedRoute } from "@angular/router";
import { CacheTokenService } from "../../http-interceptors/cache-token.service"; //引入服务
import { MatSnackBar, MatSnackBarConfig } from "@angular/material/snack-bar";
import { MatDialog, MatDialogRef } from "@angular/material/dialog";
@Component({
selector: 'app-login',
templateUrl: './login.component.html',
styleUrls: ['./login.component.scss'],
selector: "app-login",
templateUrl: "./login.component.html",
styleUrls: ["./login.component.scss"],
})
export class LoginComponent implements OnInit {
constructor(private http: HttpClient, private router: Router, private route: ActivatedRoute, public token: CacheTokenService, public snackBar: MatSnackBar, public dialog: MatDialog) {
}
constructor(
private http: HttpClient,
private router: Router,
private route: ActivatedRoute,
public token: CacheTokenService,
public snackBar: MatSnackBar,
public dialog: MatDialog
) {}
ngOnInit() {
this.automaticLogin()
this.automaticLogin();
}
errmsg: string = ''
errmsg: string = "";
onSubmit(e) {
this.http.post('/api/Account/SignIn', {
this.http
.post("/api/Account/SignIn", {
name: e.name,
password: e.password
}).subscribe((data: Data) => {
password: e.password,
})
.subscribe(
(data: Data) => {
sessionStorage.setItem("level", data.level);
sessionStorage.setItem("token", data.token);
sessionStorage.setItem("refreshToken", data.refreshToken);
sessionStorage.setItem("isDefaultPassword", data.isDefaultPassword); //是否需要修改默认密码
this.http.get('/api/Account/NavMenus').subscribe((data: any) => {
let isHave = data.find(item => { return item.url == "/statisticanalysis/home" })
let isHaveGis = data.find(item => { return item.url == "/gis" })
this.http.get("/api/Account/NavMenus").subscribe((data: any) => {
console.log("菜单数据", data);
let isHave = data.find((item) => {
return item.url == "/statisticanalysis/home";
});
let isHaveGis = data.find((item) => {
return item.url == "/gis";
});
let isKeyUnit = data.find((item) => {
return item.url == "/keyUnit";
});
let URL = data.find((item) => {
return item.url;
});
console.log(URL);
if (isHave) {
this.router.navigate([`/statisticanalysis/home`])
this.dialogChangePassword()
return
this.router.navigate([`/statisticanalysis/home`]);
this.dialogChangePassword();
return;
} else if (isHaveGis) {
this.router.navigate([`/gis`])
this.dialogChangePassword()
return
this.router.navigate([`/gis`]);
this.dialogChangePassword();
return;
} else if (isKeyUnit) {
this.router.navigate([`/keyUnit`]);
this.dialogChangePassword();
return;
} else if (data.length != 0) {
this.router.navigate([`/keyUnit`])
this.dialogChangePassword()
return
this.router.navigate([URL.url]);
this.dialogChangePassword();
return;
} else {
this.snackBar.open('该用户角色未分配任何菜单', '确定', {
duration: 3000
this.snackBar.open("该用户角色未分配任何菜单", "确定", {
duration: 3000,
});
}
})
if (e.notlogin) { //7天免登录时
localStorage.setItem("isnologin", "true")
localStorage.setItem("token", data.token)
localStorage.setItem("refreshToken", data.refreshToken)
});
if (e.notlogin) {
//7天免登录时
localStorage.setItem("isnologin", "true");
localStorage.setItem("token", data.token);
localStorage.setItem("refreshToken", data.refreshToken);
}
//调用服务中的function刷新token
this.token.startUp()
this.token.startUp();
},
(err) => { this.errmsg = err }
)
(err) => {
this.errmsg = err;
}
);
}
dialogChangePassword() {
if (sessionStorage.getItem('isDefaultPassword') == 'true') {
let dialogRef = this.dialog.open(ChangepasswordComponent2,
{ width: '348px' });
if (sessionStorage.getItem("isDefaultPassword") == "true") {
let dialogRef = this.dialog.open(ChangepasswordComponent2, {
width: "348px",
});
dialogRef.afterClosed().subscribe((data) => {
sessionStorage.setItem('isDefaultPassword', 'false')
// this.lookUpdateData()
sessionStorage.setItem("isDefaultPassword", "false");
});
} else {
// this.lookUpdateData()
}
}
//查看更新内容
lookUpdateData() {
let dialogRef = this.dialog.open(lookUpdateDataComponent,
{ width: '668px' });
dialogRef.afterClosed().subscribe((data) => {
let dialogRef = this.dialog.open(lookUpdateDataComponent, {
width: "668px",
});
}
dialogRef.afterClosed().subscribe((data) => {});
}
//7天免登录自动登录
automaticLogin() {
let isNoLogin = localStorage.getItem("isnologin")
if (isNoLogin) { //7天免登录时
let isNoLogin = localStorage.getItem("isnologin");
if (isNoLogin) {
//7天免登录时
let token = localStorage.getItem("token");
let refreshToken = localStorage.getItem("refreshToken");
this.http.post('/api/Account/RefreshToken', {
this.http
.post("/api/Account/RefreshToken", {
token: token,
refreshToken: refreshToken
}).subscribe((data: any) => {
refreshToken: refreshToken,
})
.subscribe((data: any) => {
sessionStorage.setItem("level", data.level);
sessionStorage.setItem("token", data.token);
sessionStorage.setItem("refreshToken", data.refreshToken);
this.token.startUp()
this.router.navigate(['/keyUnit'])
this.snackBar.open('已自动登录', '确定', { duration: 3000 });
})
this.token.startUp();
this.router.navigate(["/keyUnit"]);
this.snackBar.open("已自动登录", "确定", { duration: 3000 });
});
} //if
}
//打开弹窗
open() {
this.snackBar.open('请联系管理员', '确定', {
duration: 3000
this.snackBar.open("请联系管理员", "确定", {
duration: 3000,
});
}
}
@Component({
selector: 'app-changepassword',
templateUrl: './changePassword.html',
styleUrls: ['./changepassword.scss']
selector: "app-changepassword",
templateUrl: "./changePassword.html",
styleUrls: ["./changepassword.scss"],
})
export class ChangepasswordComponent2 implements OnInit {
constructor(
private http: HttpClient,
public snackBar: MatSnackBar,
public dialogRef: MatDialogRef<ChangepasswordComponent2>
) {}
constructor(private http: HttpClient, public snackBar: MatSnackBar,
public dialogRef: MatDialogRef<ChangepasswordComponent2>) { }
ngOnInit() {
}
errmsg: string = ''
ngOnInit() {}
errmsg: string = "";
onSubmit(e) {
this.http.put(
'/api/Account/Password',
{
this.http
.put("/api/Account/Password", {
newPassword: e.newPassword,
password: 'SHya119!@'
}
).subscribe(data => {
password: "SHya119!@",
})
.subscribe(
(data) => {
this.dialogRef.close(data);
const config = new MatSnackBarConfig();
config.verticalPosition = 'top';
config.duration = 3000
this.snackBar.open('密码修改成功', '确定', config);
}, (err) => { this.errmsg = err }
)
config.verticalPosition = "top";
config.duration = 3000;
this.snackBar.open("密码修改成功", "确定", config);
},
(err) => {
this.errmsg = err;
}
);
}
}
@Component({
selector: 'app-lookUpdateData',
templateUrl: './lookUpdateData.html',
styleUrls: ['./lookUpdateData.scss']
selector: "app-lookUpdateData",
templateUrl: "./lookUpdateData.html",
styleUrls: ["./lookUpdateData.scss"],
})
export class lookUpdateDataComponent implements OnInit {
constructor(private http: HttpClient, public snackBar: MatSnackBar,
public dialogRef: MatDialogRef<lookUpdateDataComponent>) { }
ngOnInit() {
}
onSubmit(e) {
}
constructor(
private http: HttpClient,
public snackBar: MatSnackBar,
public dialogRef: MatDialogRef<lookUpdateDataComponent>
) {}
ngOnInit() {}
onSubmit(e) {}
}

13
src/app/plan-audit/plan-record/plan-record.component.ts

@ -8,8 +8,8 @@ import {
} from "@angular/material/dialog";
import { HttpClient } from "@angular/common/http";
import { DomSanitizer } from "@angular/platform-browser";
import { Viewer } from "photo-sphere-viewer";
import * as ViewerJs from "viewerjs";
import { photoViewer } from "photo-sphere-viewer";
import Viewer from "viewerjs";
@Component({
selector: "app-plan-record",
templateUrl: "./plan-record.component.html",
@ -234,7 +234,7 @@ export class PlanRecordComponent implements OnInit {
obj.innerHTML = "";
}
window.setTimeout(() => {
this.viewer = new Viewer({
this.viewer = new photoViewer({
container: document.querySelector("#viewer"),
panorama: "/api/Objects/PlanPlatform/" + this.fetchUrl,
});
@ -248,15 +248,12 @@ export class PlanRecordComponent implements OnInit {
node.id = "img";
dom.appendChild(node);
setTimeout(() => {
let viewer = new ViewerJs(
document.getElementById(`viewerjs`),
{
let viewer = new Viewer(document.getElementById(`viewerjs`), {
hidden: () => {
dom.removeChild(pObjs[0]);
viewer.destroy();
},
}
);
});
node.click();
}, 0);
} else {

61
src/app/plan-audit/wait-examineer/wait-examineer.component.ts

@ -17,9 +17,9 @@ import {
import { HttpClient } from "@angular/common/http";
declare var CryptoJS;
import { DomSanitizer } from "@angular/platform-browser";
import { Viewer as photoViewer } from "photo-sphere-viewer";
import { photoViewer } from "photo-sphere-viewer";
declare var echarts: any;
import * as ViewerJs from "viewerjs";
import Viewer from "viewerjs";
@Component({
selector: "app-wait-examineer",
templateUrl: "./wait-examineer.component.html",
@ -156,30 +156,7 @@ export class WaitExamineerComponent implements OnInit {
this.PageNumber = e.pageIndex + 1;
this.getAlltabledate();
}
lookImg(imgUrl, type?: boolean) {
// console.log(imgUrl)
let dom = document.getElementById(`viewerjs`);
let pObjs = dom.childNodes;
let node = document.createElement("img");
node.style.display = "none";
if (type) {
let src = imgUrl.split("?")[0];
node.src = src;
} else {
node.src = "/api/Objects/PlanPlatform/" + imgUrl;
}
node.id = "imgxxx";
dom.appendChild(node);
setTimeout(() => {
let viewer = new Viewer(document.getElementById(`viewerjs`), {
hidden: () => {
dom.removeChild(pObjs[0]);
viewer.destroy();
},
});
node.click();
}, 0);
}
//radio点击事件
viewer; //全景图对象
waterData: any; //需要传递给子组件的水源信息
@ -371,15 +348,12 @@ export class WaitExamineerComponent implements OnInit {
node.id = "img";
dom.appendChild(node);
setTimeout(() => {
let viewer = new ViewerJs(
document.getElementById(`viewerjs`),
{
let viewer = new Viewer(document.getElementById(`viewerjs`), {
hidden: () => {
dom.removeChild(pObjs[0]);
viewer.destroy();
},
}
);
});
node.click();
}, 0);
} else {
@ -406,7 +380,30 @@ export class WaitExamineerComponent implements OnInit {
}
this.radioid = item.itemId;
}
lookImg(imgUrl, type?: boolean) {
// console.log(imgUrl)
let dom = document.getElementById(`viewerjs`);
let pObjs = dom.childNodes;
let node = document.createElement("img");
node.style.display = "none";
if (type) {
let src = imgUrl.split("?")[0];
node.src = src;
} else {
node.src = "/api/Objects/PlanPlatform/" + imgUrl;
}
node.id = "imgxxx";
dom.appendChild(node);
setTimeout(() => {
let viewer = new Viewer(document.getElementById(`viewerjs`), {
hidden: () => {
dom.removeChild(pObjs[0]);
viewer.destroy();
},
});
node.click();
}, 0);
}
//毕升
lookWord() {
console.log("lookWord");

7
src/app/statistic-analysis/home/home.component.html

@ -70,12 +70,7 @@
<div class="item-txt" id="number02">{{dataGetNum}}</div>
</div> -->
</div>
<!-- 图表 -->
<!-- <div class="panel panel06 mt-mlger">
<div class="panel-bd">
<div id="chartQusj" class="chart-item"></div>
</div>
</div> -->
</div>
<!-- 右侧 -->
<div class="main-right">

1
src/app/statistic-analysis/home/home.component.scss

@ -4,6 +4,7 @@
}
#chartMap{
margin-left: 5px;
// border: 1px solid red;
}
.number-area{
position: absolute;

661
src/app/statistic-analysis/home/home.component.ts

@ -1,50 +1,106 @@
import { Component, OnInit, Renderer2, ElementRef } from '@angular/core';
import { HttpClient } from '@angular/common/http'
import { Router } from '@angular/router';
import { EchartsDataService } from '../echarts-data.service';
import { MapFactory } from '@src/modules/map/declare/factory';
import { IMap } from '@src/modules/map/declare/map';
import { Component, OnInit, Renderer2, ElementRef } from "@angular/core";
import { HttpClient } from "@angular/common/http";
import { Router } from "@angular/router";
import { EchartsDataService } from "../echarts-data.service";
import { MapFactory } from "@src/modules/map/declare/factory";
import { IMap } from "@src/modules/map/declare/map";
declare var echarts: any;
// import "../../../assets/echarts/tianjin.js";
// import * as echarts from "echarts";
// import jiangxi from '../../../assets/echarts/tianjin.json';
@Component({
selector: 'app-home',
templateUrl: './home.component.html',
styleUrls: ['./home.component.scss']
selector: "app-home",
templateUrl: "./home.component.html",
styleUrls: ["./home.component.scss"],
})
export class HomeComponent implements OnInit {
constructor(private http: HttpClient, private render2: Renderer2, public element: ElementRef, private router: Router, public emitService: EchartsDataService) { }
mapData;
constructor(
private http: HttpClient,
private render2: Renderer2,
public element: ElementRef,
private router: Router,
public emitService: EchartsDataService
) {
this.http.get("assets/echarts/tianjin.json").subscribe((res) => {
this.mapData = res;
console.log("--- result :: ", res);
});
}
map: IMap; //地图
yuandata
yuandata;
ngOnInit() {
this.getechartsdata()
this.getYearlyCompleteProgress()
window.setTimeout(() => {
/* this.unitType()
this.unitData()
this.keyUnit() */
this.mapInit() //初始化地图
}, 0)
}
this.getechartsdata();
this.getYearlyCompleteProgress();
setTimeout(() => {
this.echartsMap();
}, 0);
}
echartsMap() {
console.log(999);
let myChart = echarts.init(document.getElementById("chartMap"));
let option = {
geo: {
map: "tianjin", //这里的名称需要和shandong.js: echarts.registerMap('shandong',{})中的名称一致
// label: { show: true }, //显示地点
roam: true, //缩放,
zoom: 1.2,
label: {
show: true, // 是否显示标签。
fontSize: "11",
color: "rgba(0,0,0,0.7)",
},
itemStyle: {
color: "#45c2f9",
borderColor: "rgba(255, 0, 0, 0.2)", // 图形的描边颜色。
borderWidth: 1, // 描边线宽。为 0 时无描边。
borderType: "solid", // 描边类型。
},
emphasis: {
focus: "none", //在高亮图形时,是否淡出其它数据的图形已达到聚焦的效果。'none' 不淡出其它图形,默认使用该配置。'self' 聚焦当前高亮图形,淡出其它图形。
// 高亮状态下文本标签
label: {
color: "#ffffff",
},
// 高亮状态下图形样式
itemStyle: {
areaColor: "#409eff", // 高亮区域的颜色。
color: "#67c23a", // 高亮区域的颜色。areaColor和color都设置,高亮区域渲染areaColor的值
borderColor: "rgba(0, 0, 0, 0.8)", // 图形的描边颜色。
borderWidth: 3, // 描边线宽。为 0 时无描边。
borderType: "dotted", // 描边类型。
},
},
},
series: [],
};
echarts.registerMap("tianjin", this.mapData);
myChart.setOption(option);
window.addEventListener("resize", function () {
myChart.resize();
});
}
//获得年度完成情况
completeProgress: any = {
monthlyCompleteProgress: '',
yearlyCompleteProgress: ''
}
monthlyCompleteProgress: "",
yearlyCompleteProgress: "",
};
getYearlyCompleteProgress() {
this.http.get('/api/StatisticsAnalysis/Companies/YearlyCompleteProgress').subscribe((data) => {
this.http
.get("/api/StatisticsAnalysis/Companies/YearlyCompleteProgress")
.subscribe((data) => {
// console.log('获得年度完成情况', data)
this.completeProgress = data
})
this.completeProgress = data;
});
}
integrity(width) {
let style: any = {}
style.width = width + '%';
return style
let style: any = {};
style.width = width + "%";
return style;
}
//更新echarts视图
@ -54,34 +110,37 @@ export class HomeComponent implements OnInit {
this.chartZdgzqy.resize()
} */
//获取数据
ordata
buildtableData
lengthdata = []//建筑提示数据
buildcount = 0//建筑总数
indexData = []//建筑所有数据
ordata;
buildtableData;
lengthdata = []; //建筑提示数据
buildcount = 0; //建筑总数
indexData = []; //建筑所有数据
async getechartsdata() {
let paramsdata: any = {
OrganizationId: this.orid || '',
OrganizationId: this.orid || "",
//organizationId:'1'
}
};
//获取组织机构数据
await this.emitService.getData(paramsdata, `/api/StatisticsAnalysis/Companies`)
this.ordata = JSON.parse(JSON.stringify(this.emitService.allDate))
console.log(this.ordata)
this.keyUnitNum = this.ordata[0].organizationStatistics.totalCount
this.unitData()
await this.emitService.getData(
paramsdata,
`/api/StatisticsAnalysis/Companies`
);
this.ordata = JSON.parse(JSON.stringify(this.emitService.allDate));
console.log(this.ordata);
this.keyUnitNum = this.ordata[0].organizationStatistics.totalCount;
this.unitData();
//获取预案状态统计数据
await this.emitService.getData(paramsdata, `/api/StatisticsAnalysis/Plans`)
this.unitType()
await this.emitService.getData(paramsdata, `/api/StatisticsAnalysis/Plans`);
this.unitType();
//获取建筑类型统计数据
await this.emitService.getData(paramsdata, `/api/StatisticsAnalysis/BuildingTypes`)
this.keyUnit()
await this.emitService.getData(
paramsdata,
`/api/StatisticsAnalysis/BuildingTypes`
);
this.keyUnit();
}
//获取年度完成情况数据
getYearData() {
}
getYearData() {}
threePlan() {
// this.router.navigate(['/planManagement/entryPlan'])
@ -98,7 +157,7 @@ export class HomeComponent implements OnInit {
//计划更新页面跳转
scheduled() {
this.router.navigate(['/statisticanalysis/scheduledUpdates'])
this.router.navigate(["/statisticanalysis/scheduledUpdates"]);
}
ngOnDestroy(): void {
@ -108,185 +167,265 @@ export class HomeComponent implements OnInit {
this.chartDwsjcj.dispose()
this.chartZdgzqy.clear()
this.chartZdgzqy.dispose() */
}
//初始化地图
adcode: any //行政编码
level = sessionStorage.getItem("level")//组织级别
orid
adcode: any; //行政编码
level = sessionStorage.getItem("level"); //组织级别
orid;
//封装Gaode
getEchartsData(data) {
return new Promise((resolve, reject) => {
let paramsdata: any = {
name: data.properties.name,
level: Number(this.level) + 1
}
this.http.get("/api/Organizations/GetIdByName", { params: paramsdata }).subscribe((data: any) => {
this.orid = data[0]
this.getechartsdata()
resolve('success')
})
})
level: Number(this.level) + 1,
};
this.http
.get("/api/Organizations/GetIdByName", { params: paramsdata })
.subscribe((data: any) => {
this.orid = data[0];
this.getechartsdata();
resolve("success");
});
});
}
setEchartsData() {
this.orid = ''
this.getechartsdata()
this.orid = "";
this.getechartsdata();
}
//封装Gaode
mapInit() {
//创建地图
this.map = MapFactory.MapInstance('chartMap', {
cursor: 'default',
this.map = MapFactory.MapInstance("chartMap", {
cursor: "default",
zooms: [8, 16],
mapStyle: "amap://styles/grey",
});
this.map.setAdministrativeAreaStyle(this, this.getEchartsData, this.setEchartsData)
}
planNum = []
keyUnitNum
dataGetNum = 6578
threePlanNum = "0"
twoPlanNum = "0"
cardPlanNum = "0"
otherPlanNum = "0"
aPlan = '0'
bPlan = '0'
cPlan = '0'
dPlan = '0'
ePlan = '0'
ngAfterViewInit(): void {
}
planState
this.map.setAdministrativeAreaStyle(
this,
this.getEchartsData,
this.setEchartsData
);
}
planNum = [];
keyUnitNum;
dataGetNum = 6578;
threePlanNum = "0";
twoPlanNum = "0";
cardPlanNum = "0";
otherPlanNum = "0";
aPlan = "0";
bPlan = "0";
cPlan = "0";
dPlan = "0";
ePlan = "0";
ngAfterViewInit(): void {}
planState;
//预案状态统计
pagedata
pagedataCount
pagedata;
pagedataCount;
unitType() {
this.planNum = []
this.pagedata = JSON.parse(JSON.stringify(this.emitService.allDate))
console.log(this.pagedata)
this.pagedataCount = String(this.pagedata[0].planStatusStatistics.totalCount)
this.planNum = [];
this.pagedata = JSON.parse(JSON.stringify(this.emitService.allDate));
console.log(this.pagedata);
this.pagedataCount = String(
this.pagedata[0].planStatusStatistics.totalCount
);
for (var i = 0; i < this.pagedataCount.length; i++) {
this.planNum.push(this.pagedataCount[i])
this.planNum.push(this.pagedataCount[i]);
}
//this.planNum.push(this.pagedataCount.split(','))
if (this.pagedata[0].planTypeStatistics.planTypes.length <= 0) {
this.threePlanNum = '0'
this.twoPlanNum = '0'
this.cardPlanNum = '0'
this.otherPlanNum = '0'
this.threePlanNum = "0";
this.twoPlanNum = "0";
this.cardPlanNum = "0";
this.otherPlanNum = "0";
} else {
this.pagedata[0].planTypeStatistics.planTypes.forEach((value, index, array) => {
if (array[index].planTypeName == 'Plan2D') {
this.twoPlanNum = array[index].count
} else if (array[index].planTypeName == 'Plan3D') {
this.threePlanNum = array[index].count
} else if (array[index].planTypeName == 'Other') {
this.otherPlanNum = array[index].count
} else if (array[index].planTypeName == 'PlanText') {
this.cardPlanNum = array[index].count
this.pagedata[0].planTypeStatistics.planTypes.forEach(
(value, index, array) => {
if (array[index].planTypeName == "Plan2D") {
this.twoPlanNum = array[index].count;
} else if (array[index].planTypeName == "Plan3D") {
this.threePlanNum = array[index].count;
} else if (array[index].planTypeName == "Other") {
this.otherPlanNum = array[index].count;
} else if (array[index].planTypeName == "PlanText") {
this.cardPlanNum = array[index].count;
}
});
}
);
}
if (this.pagedata[0].planCategoryStatistics.planCategories.length <= 0) {
this.aPlan = '0'
this.bPlan = '0'
this.cPlan = '0'
this.dPlan = '0'
this.ePlan = '0'
this.aPlan = "0";
this.bPlan = "0";
this.cPlan = "0";
this.dPlan = "0";
this.ePlan = "0";
} else {
this.pagedata[0].planCategoryStatistics.planCategories.forEach((value, index, array) => {
if (array[index].planCategoryName == 'LevelOne') {
this.aPlan = array[index].count
} else if (array[index].planCategoryName == 'LevelTwo') {
this.bPlan = array[index].count
} else if (array[index].planCategoryName == 'LevelThree') {
this.cPlan = array[index].count
} else if (array[index].planCategoryName == 'LevelFour') {
this.dPlan = array[index].count
} else if (array[index].planCategoryName == 'LevelFive') {
this.ePlan = array[index].count
this.pagedata[0].planCategoryStatistics.planCategories.forEach(
(value, index, array) => {
if (array[index].planCategoryName == "LevelOne") {
this.aPlan = array[index].count;
} else if (array[index].planCategoryName == "LevelTwo") {
this.bPlan = array[index].count;
} else if (array[index].planCategoryName == "LevelThree") {
this.cPlan = array[index].count;
} else if (array[index].planCategoryName == "LevelFour") {
this.dPlan = array[index].count;
} else if (array[index].planCategoryName == "LevelFive") {
this.ePlan = array[index].count;
}
});
}
);
}
/* */
let planStateOptionsZhi = {
title: {
text: `预案状态统计(${this.pagedata[0].planStatusStatistics.totalCount}份)`,
left: 'left',
left: "left",
textStyle: {
color: '#fff',
fontWeight: 'normal'
}
color: "#fff",
fontWeight: "normal",
},
},
tooltip: {
trigger: 'item',
formatter: '{b} : {c} ({d}%)'
trigger: "item",
formatter: "{b} : {c} ({d}%)",
},
series: [
{
name: '访问来源',
type: 'pie',
radius: '60%',
center: ['50%', '58%'],
name: "访问来源",
type: "pie",
radius: "60%",
center: ["50%", "58%"],
label: {
show: true,
//fontSize:10,
formatter: '{b}\n{d|{c}份}',
formatter: "{b}\n{d|{c}份}",
rich: {
d: {
align: 'center',
}
align: "center",
},
},
},
data: [
{ value: this.pagedata[0].planStatusStatistics.planStatuses[0] != undefined ? this.pagedata[0].planStatusStatistics.planStatuses[0].count : 0, name: '预案新增', type: 1, planStatusName: this.pagedata[0].planStatusStatistics.planStatuses[0] != undefined ? this.pagedata[0].planStatusStatistics.planStatuses[0].planStatusName : '' },
{ value: this.pagedata[0].planStatusStatistics.planStatuses[2] != undefined ? this.pagedata[0].planStatusStatistics.planStatuses[2].count : 0, name: '预案审核通过', type: 3, planStatusName: this.pagedata[0].planStatusStatistics.planStatuses[2] != undefined ? this.pagedata[0].planStatusStatistics.planStatuses[2].planStatusName : '' },
{ value: this.pagedata[0].planStatusStatistics.planStatuses[4] != undefined ? this.pagedata[0].planStatusStatistics.planStatuses[4].count : 0, name: '预案编制', type: 5, planStatusName: this.pagedata[0].planStatusStatistics.planStatuses[4] != undefined ? this.pagedata[0].planStatusStatistics.planStatuses[4].planStatusName : '' },
{ value: this.pagedata[0].planStatusStatistics.planStatuses[3] != undefined ? this.pagedata[0].planStatusStatistics.planStatuses[3].count : 0, name: '预案审核退回', type: 4, planStatusName: this.pagedata[0].planStatusStatistics.planStatuses[3] != undefined ? this.pagedata[0].planStatusStatistics.planStatuses[3].planStatusName : '' },
{ value: this.pagedata[0].planStatusStatistics.planStatuses[1] != undefined ? this.pagedata[0].planStatusStatistics.planStatuses[1].count : 0, name: '预案审核中', type: 2, planStatusName: this.pagedata[0].planStatusStatistics.planStatuses[1] != undefined ? this.pagedata[0].planStatusStatistics.planStatuses[1].planStatusName : '' }
{
value:
this.pagedata[0].planStatusStatistics.planStatuses[0] !=
undefined
? this.pagedata[0].planStatusStatistics.planStatuses[0].count
: 0,
name: "预案新增",
type: 1,
planStatusName:
this.pagedata[0].planStatusStatistics.planStatuses[0] !=
undefined
? this.pagedata[0].planStatusStatistics.planStatuses[0]
.planStatusName
: "",
},
{
value:
this.pagedata[0].planStatusStatistics.planStatuses[2] !=
undefined
? this.pagedata[0].planStatusStatistics.planStatuses[2].count
: 0,
name: "预案审核通过",
type: 3,
planStatusName:
this.pagedata[0].planStatusStatistics.planStatuses[2] !=
undefined
? this.pagedata[0].planStatusStatistics.planStatuses[2]
.planStatusName
: "",
},
{
value:
this.pagedata[0].planStatusStatistics.planStatuses[4] !=
undefined
? this.pagedata[0].planStatusStatistics.planStatuses[4].count
: 0,
name: "预案编制",
type: 5,
planStatusName:
this.pagedata[0].planStatusStatistics.planStatuses[4] !=
undefined
? this.pagedata[0].planStatusStatistics.planStatuses[4]
.planStatusName
: "",
},
{
value:
this.pagedata[0].planStatusStatistics.planStatuses[3] !=
undefined
? this.pagedata[0].planStatusStatistics.planStatuses[3].count
: 0,
name: "预案审核退回",
type: 4,
planStatusName:
this.pagedata[0].planStatusStatistics.planStatuses[3] !=
undefined
? this.pagedata[0].planStatusStatistics.planStatuses[3]
.planStatusName
: "",
},
{
value:
this.pagedata[0].planStatusStatistics.planStatuses[1] !=
undefined
? this.pagedata[0].planStatusStatistics.planStatuses[1].count
: 0,
name: "预案审核中",
type: 2,
planStatusName:
this.pagedata[0].planStatusStatistics.planStatuses[1] !=
undefined
? this.pagedata[0].planStatusStatistics.planStatuses[1]
.planStatusName
: "",
},
],
emphasis: {
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)'
}
}
}
]
shadowColor: "rgba(0, 0, 0, 0.5)",
},
},
},
],
};
this.planState = echarts.init(document.getElementById('chartHynyxf'), 'walden');
this.planState = echarts.init(
document.getElementById("chartHynyxf"),
"walden"
);
this.planState.setOption(planStateOptionsZhi);
this.planState.on("click", (params) => {
this.router.navigate(['/statisticanalysis/statePageOne'])
})
this.router.navigate(["/statisticanalysis/statePageOne"]);
});
}
//新增、删除单位统计
chartDwsjcj
addtable
addxdata = []
addydata = []
chartDwsjcj;
addtable;
addxdata = [];
addydata = [];
chartDwsjcjOptionsZhong = {
// color: ['#FB33C2', '#00CFF0', '#2C3DE0'],
// 标题
title: {
text: '新增、删除单位统计',
text: "新增、删除单位统计",
left: 0,
top: 0,
textStyle: {
color: '#fff',
fontWeight: 'normal'
color: "#fff",
fontWeight: "normal",
},
},
grid: {
@ -296,18 +435,33 @@ export class HomeComponent implements OnInit {
//图例
legend: {
top: 0,
data: ['新增单位', '删除单位',],
icon: 'circle',
data: ["新增单位", "删除单位"],
icon: "circle",
itemGap: 20,
},
//提示框
tooltip: {
trigger: 'axis',
trigger: "axis",
},
// x轴
xAxis: {
type: 'category',
data: ["浦东中队", "黄浦中队", "徐汇中队", "长宁中队", "静安中队", "普陀中队", "虹口中队", "杨浦中队", "闵行中队", "宝山中队", "嘉定中队", "松江中队", "金山中队", "崇明中队"],
type: "category",
data: [
"浦东中队",
"黄浦中队",
"徐汇中队",
"长宁中队",
"静安中队",
"普陀中队",
"虹口中队",
"杨浦中队",
"闵行中队",
"宝山中队",
"嘉定中队",
"松江中队",
"金山中队",
"崇明中队",
],
axisLabel: {
interval: 0,
@ -316,7 +470,8 @@ export class HomeComponent implements OnInit {
var maxLength = 5; //每项显示文字个数
var valLength = value.length; //X轴类目项的文字个数
var rowN = Math.ceil(valLength / maxLength); //类目项需要换行的行数
if (rowN > 1) { //如果类目项的文字大于3,
if (rowN > 1) {
//如果类目项的文字大于3,
for (var i = 0; i < rowN; i++) {
var temp = ""; //每次截取的字符串
var start = i * maxLength; //开始截取的位置
@ -329,56 +484,60 @@ export class HomeComponent implements OnInit {
} else {
return value;
}
} //function
}
}, //function
},
},
// y轴
yAxis: {
type: 'value',
type: "value",
splitLine: {
show: true,
lineStyle: {
color: 'rgba(255,255,255,.4)'
}
color: "rgba(255,255,255,.4)",
},
},
},
// 数据
series: [
{
name: '新增单位',
type: 'bar',
name: "新增单位",
type: "bar",
data: [88, 45, 95, 105, 75, 89, 69, 110, 96, 90, 80, 78, 94, 102],
label: {
show: false,
position: "top",
formatter: '{c}',
formatter: "{c}",
color: "#fff",
}
}, {
name: '删除单位',
type: 'bar',
},
},
{
name: "删除单位",
type: "bar",
data: [35, 33, 27, 30, 35, 36, 28, 32, 36, 22, 19, 28, 34, 36],
label: {
show: false,
position: "top",
formatter: '{c}',
formatter: "{c}",
color: "#fff",
}
}
},
},
],
};
unitData() {
this.addxdata = []
this.addydata = []
this.addtable = JSON.parse(JSON.stringify(this.emitService.allDate))
this.addtable[0].organizationStatistics.organizations.forEach((value, index, array) => {
if (array[index].organizationId != '5687316efa75479d96c0091a167a3b84' && array[index].organizationName != '上海总队') {
this.addxdata.push(array[index].organizationName)
this.addydata.push(array[index].count)
}
});
this.addxdata = [];
this.addydata = [];
this.addtable = JSON.parse(JSON.stringify(this.emitService.allDate));
this.addtable[0].organizationStatistics.organizations.forEach(
(value, index, array) => {
if (
array[index].organizationId != "5687316efa75479d96c0091a167a3b84" &&
array[index].organizationName != "上海总队"
) {
this.addxdata.push(array[index].organizationName);
this.addydata.push(array[index].count);
}
}
);
let chartDwsjcjOptionsZhi = {
// 标题
title: {
@ -386,15 +545,15 @@ export class HomeComponent implements OnInit {
left: 0,
top: 0,
textStyle: {
color: '#fff',
fontWeight: 'normal'
color: "#fff",
fontWeight: "normal",
},
},
grid: {
//containLabel:true,
left: 30,
right: 0,
bottom: 30
bottom: 30,
},
//图例
/* legend: {
@ -405,11 +564,11 @@ export class HomeComponent implements OnInit {
}, */
//提示框
tooltip: {
trigger: 'axis',
trigger: "axis",
},
// x轴
xAxis: {
type: 'category',
type: "category",
data: this.addxdata,
axisLabel: {
interval: 0,
@ -419,7 +578,8 @@ export class HomeComponent implements OnInit {
var maxLength = 5; //每项显示文字个数
var valLength = value.length; //X轴类目项的文字个数
var rowN = Math.ceil(valLength / maxLength); //类目项需要换行的行数
if (rowN > 1) { //如果类目项的文字大于3,
if (rowN > 1) {
//如果类目项的文字大于3,
for (var i = 0; i < rowN; i++) {
var temp = ""; //每次截取的字符串
var start = i * maxLength; //开始截取的位置
@ -432,34 +592,33 @@ export class HomeComponent implements OnInit {
} else {
return value;
}
} //function
}
}, //function
},
},
// y轴
yAxis: {
type: 'value',
type: "value",
splitLine: {
show: true,
lineStyle: {
color: 'rgba(255,255,255,.4)'
}
color: "rgba(255,255,255,.4)",
},
},
},
// 数据
series: [
{
name: '新增单位',
type: 'bar',
name: "新增单位",
type: "bar",
data: this.addydata,
label: {
show: false,
position: "top",
formatter: '{c}',
formatter: "{c}",
color: "#fff",
},
barMaxWidth: '20%'
}
barMaxWidth: "20%",
},
/* , {
name: '删除单位',
type: 'bar',
@ -473,41 +632,48 @@ export class HomeComponent implements OnInit {
} */
],
};
this.chartDwsjcj = echarts.init(document.getElementById('chartDwsjcj'), 'walden');
this.chartDwsjcj = echarts.init(
document.getElementById("chartDwsjcj"),
"walden"
);
this.chartDwsjcj.setOption(chartDwsjcjOptionsZhi);
this.chartDwsjcj.on("click", (params) => {
this.router.navigate(['/statisticanalysis/addUnit_one'])
})
this.router.navigate(["/statisticanalysis/addUnit_one"]);
});
}
chartZdgzqy
chartZdgzqy;
//建筑类型统计
keyUnit() {
this.buildcount = 0
this.buildtableData = JSON.parse(JSON.stringify(this.emitService.allDate))
this.buildcount = 0;
this.buildtableData = JSON.parse(JSON.stringify(this.emitService.allDate));
//console.log(this.buildtableData)
for (var i = 0; i < this.buildtableData[0].buildingTypes.length; i++) {
this.lengthdata.push(this.buildtableData[0].buildingTypes[i].buildingTypeName)
this.buildcount = this.buildcount + this.buildtableData[0].buildingTypes[i].count
this.indexData.push(this.buildtableData[0].buildingTypes[i])
this.lengthdata.push(
this.buildtableData[0].buildingTypes[i].buildingTypeName
);
this.buildcount =
this.buildcount + this.buildtableData[0].buildingTypes[i].count;
this.indexData.push(this.buildtableData[0].buildingTypes[i]);
}
//JSON.parse(JSON.stringify(this.indexData).replace(/buildingTypeName/g, 'name'))
this.indexData = this.indexData.map(v => { return { name: v.buildingTypeName, value: v.count, id: v.buildingTypeId } })
this.indexData = this.indexData.map((v) => {
return { name: v.buildingTypeName, value: v.count, id: v.buildingTypeId };
});
let chartZdgzqyOptionsZhi = {
title: {
text: `建筑类型统计(${this.buildcount}家)`,
top: -5,
left: 'left',
left: "left",
textStyle: {
color: '#fff',
fontWeight: 'normal'
}
color: "#fff",
fontWeight: "normal",
},
},
tooltip: {
trigger: 'item',
formatter: '{b} : {c}家 ({d}%)'
trigger: "item",
formatter: "{b} : {c}家 ({d}%)",
},
// legend: {
// orient: 'vertical',
@ -517,18 +683,18 @@ export class HomeComponent implements OnInit {
// },
series: [
{
name: '访问来源',
type: 'pie',
radius: '70%',
center: ['50%', '61%'],
name: "访问来源",
type: "pie",
radius: "70%",
center: ["50%", "61%"],
label: {
show: true,
// fontSize:13,
formatter: '{b}{c}家',
formatter: "{b}{c}家",
rich: {
d: {
align: 'center',
}
align: "center",
},
},
},
data: this.indexData,
@ -536,21 +702,24 @@ export class HomeComponent implements OnInit {
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)'
}
}
}
]
shadowColor: "rgba(0, 0, 0, 0.5)",
},
},
},
],
};
this.chartZdgzqy = echarts.init(document.getElementById('chartZdgzqy'), 'walden');
this.chartZdgzqy = echarts.init(
document.getElementById("chartZdgzqy"),
"walden"
);
this.chartZdgzqy.setOption(chartZdgzqyOptionsZhi);
this.chartZdgzqy.on("click", (params) => {
this.router.navigate(['/statisticanalysis/buildingType_one'])
})
this.router.navigate(["/statisticanalysis/buildingType_one"]);
});
}
isNumList: boolean = true
isNumList: boolean = true;
changeNumList() {
this.isNumList = !this.isNumList
this.isNumList = !this.isNumList;
}
}

19
src/assets/echarts/tianjin.js

File diff suppressed because one or more lines are too long

1
src/assets/echarts/tianjin.json

File diff suppressed because one or more lines are too long

4
src/index.html

@ -17,8 +17,4 @@
</body>
<script src="/assets/html2canvas.js"></script>
<!-- <script type="text/javascript" src="/assets/wordexport/jquery.js"></script>
<script type="text/javascript" src="/assets/wordexport/FileSaver.js"></script>
<script type="text/javascript" src="/assets/wordexport/jquery.wordexport.js"></script> -->
</html>

19
tsconfig.json

@ -12,24 +12,17 @@
"importHelpers": true,
"target": "es2015", //es6
"allowJs": true,
"typeRoots": [
"node_modules/@types"
],
"lib": [
"es2018",
"dom"
],
"typeRoots": ["node_modules/@types"],
"lib": ["es2018", "dom"],
"paths": {
"@src/*": ["src/*"]
}
},
"angularCompilerOptions": {
"fullTemplateTypeCheck": true,
"strictInjectionParameters": true
"strictInjectionParameters": true,
"resolveJsonModule": true,
"esModuleInterop": true
},
"include": [
"src/**/*.d.ts",
"src/**/*.ts",
"typings.d.ts"
]
"include": ["src/**/*.d.ts", "src/**/*.ts", "typings.d.ts"]
}

943
yarn.lock

File diff suppressed because it is too large Load Diff
Loading…
Cancel
Save