|
|
|
|
import { Injectable, EventEmitter} from '@angular/core';
|
|
|
|
|
import { Observable, ReplaySubject } from 'rxjs';
|
|
|
|
|
import { HttpClient } from '@angular/common/http'
|
|
|
|
|
@Injectable({
|
|
|
|
|
providedIn: 'root'
|
|
|
|
|
})
|
|
|
|
|
export class EchartsDataService {
|
|
|
|
|
|
|
|
|
|
constructor(private http:HttpClient) { }
|
|
|
|
|
echartsApi(){
|
|
|
|
|
this.allEcharts=this.http.get("/api/StatisticsAnalysis")
|
|
|
|
|
//return this.allEcharts.data
|
|
|
|
|
}
|
|
|
|
|
level = sessionStorage.getItem("level");
|
|
|
|
|
allEcharts
|
|
|
|
|
//计划首页
|
|
|
|
|
tableShow=false//控制首页表格显隐
|
|
|
|
|
buildingName="" //建筑类型
|
|
|
|
|
zhuXname=[""] //点击首页不同饼状图后面柱状图显示不同数据
|
|
|
|
|
|
|
|
|
|
//预案状态分析
|
|
|
|
|
statefulInspectionName:string;
|
|
|
|
|
statefulInspectionToggle:boolean = true; // true=显示当前点击柱状图 flase=显示当前点击折现图
|
|
|
|
|
|
|
|
|
|
//维护删除
|
|
|
|
|
dezhiorBuinding="zhi" //维护删除页面判断是支队查询还是建筑类型查询
|
|
|
|
|
|
|
|
|
|
//计划更新统计
|
|
|
|
|
scheduledUpdatesType:number = 0; //已核查/未核查
|
|
|
|
|
scheduledUpdatesName:string;
|
|
|
|
|
scheduledUpdatesXName:string;
|
|
|
|
|
//scheduledUpdatesToggle:string ="one"; // 显示 当前点击 已核查/未核查
|
|
|
|
|
scheduledUpdatesToggle:number=1
|
|
|
|
|
|
|
|
|
|
eventEmit = new EventEmitter();
|
|
|
|
|
zhiorBuinding="zhi"//维护更新页面判断是支队查询还是建筑类型查询
|
|
|
|
|
findShow=true //支队查询和建筑类型按钮显隐控制
|
|
|
|
|
//新增判断是组织机构还是建筑类型
|
|
|
|
|
zuzhiorBuilding="zhi"//默认是组织机构（支队）
|
|
|
|
|
|
|
|
|
|
//echarts 悬停 显示表格假数据
|
|
|
|
|
//支队提示框
|
|
|
|
|
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%"}/* ,
|
|
|
|
|
{name:"总计",number:"1356",zhanbi:"19%"} */
|
|
|
|
|
]
|
|
|
|
|
//中队提示框
|
|
|
|
|
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%"}/* ,
|
|
|
|
|
{name:"总计",number:"1356",zhanbi:"19%"} */
|
|
|
|
|
]
|
|
|
|
|
//建筑类型提示框
|
|
|
|
|
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%"}/* ,
|
|
|
|
|
{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%"} */
|
|
|
|
|
]
|
|
|
|
|
//预案提示框
|
|
|
|
|
planData = [
|
|
|
|
|
{name:"预案新增",number:"156",zhanbi:"19%"},
|
|
|
|
|
{name:"预案审核通过",number:"144",zhanbi:"21%"},
|
|
|
|
|
{name:"预案编制",number:"133",zhanbi:"20%"},
|
|
|
|
|
{name:"预案审核退回",number:"122",zhanbi:"17%"},
|
|
|
|
|
{name:"预案审核中",number:"120",zhanbi:"23%"}/* ,
|
|
|
|
|
{name:"总计",number:"561",zhanbi:"100%"}, */
|
|
|
|
|
]
|
|
|
|
|
|
|
|
|
|
//提示框表格
|
|
|
|
|
tableTooltip(dataArr,title:string){
|
|
|
|
|
let data = dataArr
|
|
|
|
|
//console.log(data)
|
|
|
|
|
var res = '<div class="tishi" style=" backgroundColor:rgba(255,255,255,1);width:100%;height:100%;"><div style="padding:10px 0 5px 0"><span style="color:#FFFFFF;font-size:26px;text-align: center;display:block;">'+title+'</span></div>'
|
|
|
|
|
res+='</br><div style="width:300px;height:100%;padding:0 20px 15px 20px"><table style="width:300px;font-size:16px; color:#FFFFFF;border-collapse:collapse;"cellspacing="0"; >';
|
|
|
|
|
res+='<thead><tr>';
|
|
|
|
|
res+='<td style="text-align:center;width:30%;">名称</td>';
|
|
|
|
|
res+='<td style="text-align:center;width:30%;">数量</td>'
|
|
|
|
|
res+='<td style="text-align:center;width:30%;">总占比</td>'
|
|
|
|
|
res+='</tr></thead>'
|
|
|
|
|
res+='<tbody>';
|
|
|
|
|
for(var i=0;i<data.length;i++){
|
|
|
|
|
res+='<tr>'
|
|
|
|
|
res+='<td style="text-align:center;">'+data[i].name+'</td>'
|
|
|
|
|
res+='<td style="text-align:center;">'+data[i].number+'</td>'
|
|
|
|
|
res+='<td style="text-align:center;">'+data[i].zhanbi+'</td></tr>'
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
res+='</tbody>'
|
|
|
|
|
res+='<tfoot style="font-size:18px;"><td style="text-align:center;">总计</td><td style="text-align:center;">1356</td><td style="text-align:center;">19%</td></tfoot>'
|
|
|
|
|
res+='</table></div></div>'
|
|
|
|
|
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];
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
tableTooltipNoShow2(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 = pointX + 60;
|
|
|
|
|
} else { // 左边放的下
|
|
|
|
|
x = pointX + 80;
|
|
|
|
|
}
|
|
|
|
|
// 说明鼠标右边放不下提示框
|
|
|
|
|
if(viewWidth - 100 - pointX < boxWidth){
|
|
|
|
|
x = pointX - boxWidth-50;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// boxHeight > pointY 说明鼠标上边放不下提示框
|
|
|
|
|
if (boxHeight > pointY) {
|
|
|
|
|
y = 65;
|
|
|
|
|
} else { // 上边放得下
|
|
|
|
|
y = pointY - boxHeight;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return [x, y];
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
//第三层鼠标弹窗效果
|
|
|
|
|
tableTooltipNoShowq(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 = pointX + 40;
|
|
|
|
|
//上面放不下
|
|
|
|
|
if (boxHeight > pointY){
|
|
|
|
|
y=pointY+30
|
|
|
|
|
}
|
|
|
|
|
//下面放不下
|
|
|
|
|
if(viewHeight+162-pointY<boxHeight){
|
|
|
|
|
y=pointY-boxHeight+90
|
|
|
|
|
}
|
|
|
|
|
} else if(viewWidth - 100 - pointX < boxWidth){ // 左边放的下右边放不下
|
|
|
|
|
x = pointX - boxWidth-50;
|
|
|
|
|
//上面放不下
|
|
|
|
|
if (boxHeight > pointY){
|
|
|
|
|
y=pointY+30
|
|
|
|
|
}
|
|
|
|
|
//下面放不下
|
|
|
|
|
if(viewHeight+162-pointY<boxHeight){
|
|
|
|
|
y=pointY-boxHeight+90
|
|
|
|
|
}
|
|
|
|
|
//x = pointX + 80;
|
|
|
|
|
}else{//左右都能放下
|
|
|
|
|
//上面放不下
|
|
|
|
|
if (boxHeight > pointY){
|
|
|
|
|
y=pointY+30
|
|
|
|
|
}
|
|
|
|
|
//下面放不下
|
|
|
|
|
if(viewHeight+162-pointY<boxHeight){
|
|
|
|
|
y=pointY-boxHeight+90
|
|
|
|
|
}
|
|
|
|
|
else{
|
|
|
|
|
y=pointY+30
|
|
|
|
|
}
|
|
|
|
|
x = pointX + 40;
|
|
|
|
|
}
|
|
|
|
|
// 说明鼠标右边放不下提示框
|
|
|
|
|
/* if(viewWidth - 100 - pointX < boxWidth){
|
|
|
|
|
x = pointX - boxWidth-50;
|
|
|
|
|
} */
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// boxHeight > pointY 说明鼠标上边放不下提示框
|
|
|
|
|
/* if (boxHeight > pointY) {
|
|
|
|
|
y = 65;
|
|
|
|
|
} else { // 上边放得下
|
|
|
|
|
y = pointY - boxHeight;
|
|
|
|
|
} */
|
|
|
|
|
|
|
|
|
|
return [x, y];
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
//第二层鼠标弹窗效果
|
|
|
|
|
tableTooltipNoShowt(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 = pointX + 40;
|
|
|
|
|
//上面放不下
|
|
|
|
|
if (boxHeight > pointY){
|
|
|
|
|
y=pointY+30
|
|
|
|
|
}
|
|
|
|
|
//下面放不下
|
|
|
|
|
if(viewHeight+400-pointY<boxHeight){
|
|
|
|
|
y=pointY-boxHeight+105
|
|
|
|
|
}
|
|
|
|
|
} else if(viewWidth - 100 - pointX < boxWidth){ // 左边放的下右边放不下
|
|
|
|
|
x = pointX - boxWidth-50;
|
|
|
|
|
//上面放不下
|
|
|
|
|
if (boxHeight > pointY){
|
|
|
|
|
y=pointY+30
|
|
|
|
|
}
|
|
|
|
|
//下面放不下
|
|
|
|
|
if(viewHeight+400-pointY<boxHeight){
|
|
|
|
|
y=pointY-boxHeight+90
|
|
|
|
|
}
|
|
|
|
|
//x = pointX + 80;
|
|
|
|
|
}else{//左右都能放下
|
|
|
|
|
//上面放不下
|
|
|
|
|
if (boxHeight > pointY){
|
|
|
|
|
y=pointY+30
|
|
|
|
|
}
|
|
|
|
|
//下面放不下
|
|
|
|
|
if(viewHeight+400-pointY<boxHeight){
|
|
|
|
|
y=pointY-boxHeight+90
|
|
|
|
|
}
|
|
|
|
|
else{
|
|
|
|
|
y=pointY+30
|
|
|
|
|
}
|
|
|
|
|
x = pointX + 40;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return [x, y];
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
//用法：
|
|
|
|
|
// 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
|
|
|
|
|
// }
|
|
|
|
|
/**
|
|
|
|
|
* @name: 中队表格提示框封装
|
|
|
|
|
* @test: test font
|
|
|
|
|
* @msg:
|
|
|
|
|
* @param {string(表头)}
|
|
|
|
|
* @return {type}
|
|
|
|
|
*/
|
|
|
|
|
biaogeTishi(biaotou:string){
|
|
|
|
|
var res = '<div class="tishi" style=" backgroundColor:rgba(255,255,255,1);width:100%;height:100%;"><div style="padding:10px 0 5px 0"><span style="color:#FFFFFF;font-size:27px;text-align: center;display:block;">'+biaotou+'</span></div>'
|
|
|
|
|
res+='</br><div style="width:300px;height:100%;padding:0 20px 15px 20px"><table style="width:300px;font-size:16px; color:#FFFFFF;border-collapse:collapse;"cellspacing="0"; >';
|
|
|
|
|
res+='<thead style="font-size:18px;"><tr>';
|
|
|
|
|
res+='<td style="text-align:center;width:30%;">名称</td>';
|
|
|
|
|
res+='<td style="text-align:center;width:30%;">数量</td>'
|
|
|
|
|
res+='<td style="text-align:center;width:30%;">总占比</td>'
|
|
|
|
|
res+='</tr></thead>'
|
|
|
|
|
res+='<tbody>';
|
|
|
|
|
//var res='<div class="tishi" style=" width:100%;height:100%;"><div style="padding:10px 0 5px 0"><span >'+biaotou+'</span></div>'
|
|
|
|
|
for(var i=0;i<this.tableDataZhong.length;i++){
|
|
|
|
|
res+='<tr>'
|
|
|
|
|
res+='<td style="text-align:center;">'+this.tableDataZhong[i].name+'</td>'
|
|
|
|
|
res+='<td style="text-align:center;">'+this.tableDataZhong[i].number+'</td>'
|
|
|
|
|
res+='<td style="text-align:center;">'+this.tableDataZhong[i].zhanbi+'</td></tr>'
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
res+='</tbody>'
|
|
|
|
|
res+='<tfoot style="font-size:18px;"><td style="text-align:center;">总计</td><td style="text-align:center;">1356</td><td style="text-align:center;">19%</td></tfoot>'
|
|
|
|
|
res+='</table></div></div>'
|
|
|
|
|
return res
|
|
|
|
|
}
|
|
|
|
|
/**
|
|
|
|
|
* @name: 表格提示框封装(总队)
|
|
|
|
|
* @test: test font
|
|
|
|
|
* @msg:
|
|
|
|
|
* @param {string(表头)}
|
|
|
|
|
* @return {type}
|
|
|
|
|
*/
|
|
|
|
|
res
|
|
|
|
|
tishiData
|
|
|
|
|
localData
|
|
|
|
|
biaogeTishiZhi(datas){
|
|
|
|
|
console.log(datas)
|
|
|
|
|
for(var a in this.obdata[0].buildingTypes){
|
|
|
|
|
if(this.obdata[0].buildingTypes[a].buildingTypeName==datas.name){
|
|
|
|
|
this.tishiData=this.obdata[0].buildingTypes[a].organizations
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
console.log(this.tishiData)
|
|
|
|
|
var countall=0//总计
|
|
|
|
|
var countbi=0//站比
|
|
|
|
|
var allCountbi=0//总站比
|
|
|
|
|
for(var i=0;i<this.tishiData.length;i++){
|
|
|
|
|
countall+=this.tishiData[i].count
|
|
|
|
|
}
|
|
|
|
|
this.res= '<div class="tishi" style=" backgroundColor:rgba(255,255,255,1);width:100%;height:100%;"><div style="padding:10px 0 5px 0"><span style="color:#FFFFFF;font-size:27px;text-align: center;display:block;">'+datas.name+'</span></div>'
|
|
|
|
|
this.res+='</br><div style="width:300px;height:100%;padding:0 20px 15px 20px"><table style="width:300px;font-size:16px; color:#FFFFFF;border-collapse:collapse;"cellspacing="0"; >';
|
|
|
|
|
this.res+='<thead style="font-size:18px;"><tr>';
|
|
|
|
|
this.res+='<td style="text-align:center;width:30%;">名称</td>';
|
|
|
|
|
this.res+='<td style="text-align:center;width:30%;">数量</td>'
|
|
|
|
|
this.res+='<td style="text-align:center;width:30%;">总占比</td>'
|
|
|
|
|
this.res+='</tr></thead>'
|
|
|
|
|
this.res+='<tbody>';
|
|
|
|
|
for(var i=0;i<this.tishiData.length;i++){
|
|
|
|
|
countbi=Math.round(this.tishiData[i].count/countall* 10000)/ 100.00
|
|
|
|
|
allCountbi=allCountbi+countbi
|
|
|
|
|
this.res+='<tr>'
|
|
|
|
|
this.res+='<td style="text-align:center;">'+this.tishiData[i].organizationName+'</td>'
|
|
|
|
|
this.res+='<td style="text-align:center;">'+this.tishiData[i].count+'</td>'
|
|
|
|
|
this.res+='<td style="text-align:center;">'+countbi+'%</td></tr>'
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
this.res+='</tbody>'
|
|
|
|
|
this.res+='<tfoot style="font-size:18px;"><td style="text-align:center;">总计</td><td style="text-align:center;">'+countall+'</td><td style="text-align:center;">'+allCountbi.toFixed(2)+'%</td></tfoot>'
|
|
|
|
|
this.res+='</table></div></div>'
|
|
|
|
|
return this.res
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
//支队表格提示
|
|
|
|
|
biaogeTishida(datas){
|
|
|
|
|
console.log(datas)
|
|
|
|
|
this.tishiData=''
|
|
|
|
|
for(var a in this.obdata[0].organizations){
|
|
|
|
|
if(this.obdata[0].organizations[a].organizationName==datas.name){
|
|
|
|
|
this.tishiData=this.obdata[0].organizations[a].subOrganizations
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
console.log(this.tishiData)
|
|
|
|
|
var countall=0//总计
|
|
|
|
|
var countbi=0//站比
|
|
|
|
|
var allCountbi=0//总站比
|
|
|
|
|
for(var i=0;i<this.tishiData.length;i++){
|
|
|
|
|
countall+=this.tishiData[i].count
|
|
|
|
|
}
|
|
|
|
|
this.res= '<div class="tishi" style=" backgroundColor:rgba(255,255,255,1);width:100%;height:100%;"><div style="padding:10px 0 5px 0"><span style="color:#FFFFFF;font-size:27px;text-align: center;display:block;">'+datas.name+'</span></div>'
|
|
|
|
|
this.res+='</br><div style="width:300px;height:100%;padding:0 20px 15px 20px"><table style="width:300px;font-size:16px; color:#FFFFFF;border-collapse:collapse;"cellspacing="0"; >';
|
|
|
|
|
this.res+='<thead style="font-size:18px;"><tr>';
|
|
|
|
|
this.res+='<td style="text-align:center;width:30%;">名称</td>';
|
|
|
|
|
this.res+='<td style="text-align:center;width:30%;">数量</td>'
|
|
|
|
|
this.res+='<td style="text-align:center;width:30%;">总占比</td>'
|
|
|
|
|
this.res+='</tr></thead>'
|
|
|
|
|
this.res+='<tbody>';
|
|
|
|
|
for(var i=0;i<this.tishiData.length;i++){
|
|
|
|
|
countbi=Math.round(this.tishiData[i].count/countall* 10000)/ 100.00
|
|
|
|
|
allCountbi=allCountbi+countbi
|
|
|
|
|
this.res+='<tr>'
|
|
|
|
|
this.res+='<td style="text-align:center;">'+this.tishiData[i].organizationName+'</td>'
|
|
|
|
|
this.res+='<td style="text-align:center;">'+this.tishiData[i].count+'</td>'
|
|
|
|
|
this.res+='<td style="text-align:center;">'+countbi+'%</td></tr>'
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
this.res+='</tbody>'
|
|
|
|
|
this.res+='<tfoot style="font-size:18px;"><td style="text-align:center;">总计</td><td style="text-align:center;">'+countall+'</td><td style="text-align:center;">'+allCountbi.toFixed(2)+'%</td></tfoot>'
|
|
|
|
|
this.res+='</table></div></div>'
|
|
|
|
|
return this.res
|
|
|
|
|
}
|
|
|
|
|
//预案表格提示
|
|
|
|
|
apidata=[]
|
|
|
|
|
biaogeTishiyuan(datas){
|
|
|
|
|
//localStorage.setItem('tishi',this.tishiData)
|
|
|
|
|
let paramdata={
|
|
|
|
|
planStatus:datas.type
|
|
|
|
|
}
|
|
|
|
|
if(localStorage.getItem('tishi')==undefined){
|
|
|
|
|
this.http.get(`/api/StatisticsAnalysis/Plans/Status`).subscribe((data:any)=>{
|
|
|
|
|
this.tishiData=data.organizations
|
|
|
|
|
localStorage.setItem('tishi',JSON.stringify(this.tishiData))
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
this.localData=localStorage.getItem('tishi')
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* window.setTimeout(()=>{
|
|
|
|
|
var countall=0//总计
|
|
|
|
|
var countbi=0//站比
|
|
|
|
|
var allCountbi=0//总站比
|
|
|
|
|
for(var i=0;i<this.tishiData.length;i++){
|
|
|
|
|
countall+=this.tishiData[i].count
|
|
|
|
|
}
|
|
|
|
|
this.res= '<div class="tishi" style=" backgroundColor:rgba(255,255,255,1);width:100%;height:100%;"><div style="padding:10px 0 5px 0"><span style="color:#FFFFFF;font-size:27px;text-align: center;display:block;">'+datas.name+'</span></div>'
|
|
|
|
|
this.res+='</br><div style="width:300px;height:100%;padding:0 20px 15px 20px"><table style="width:300px;font-size:16px; color:#FFFFFF;border-collapse:collapse;"cellspacing="0"; >';
|
|
|
|
|
this.res+='<thead style="font-size:18px;"><tr>';
|
|
|
|
|
this.res+='<td style="text-align:center;width:30%;">名称</td>';
|
|
|
|
|
this.res+='<td style="text-align:center;width:30%;">数量</td>'
|
|
|
|
|
this.res+='<td style="text-align:center;width:30%;">总占比</td>'
|
|
|
|
|
this.res+='</tr></thead>'
|
|
|
|
|
this.res+='<tbody>';
|
|
|
|
|
for(var i=0;i<this.tishiData.length;i++){
|
|
|
|
|
countbi=Math.round(this.tishiData[i].count/countall* 10000)/ 100.00
|
|
|
|
|
allCountbi=allCountbi+countbi
|
|
|
|
|
this.res+='<tr>'
|
|
|
|
|
this.res+='<td style="text-align:center;">'+this.tishiData[i].organizationName+'</td>'
|
|
|
|
|
this.res+='<td style="text-align:center;">'+this.tishiData[i].count+'</td>'
|
|
|
|
|
this.res+='<td style="text-align:center;">'+countbi+'%</td></tr>'
|
|
|
|
|
}
|
|
|
|
|
this.res+='</tbody>'
|
|
|
|
|
this.res+='<tfoot style="font-size:18px;"><td style="text-align:center;">总计</td><td style="text-align:center;">'+countall+'</td><td style="text-align:center;">'+allCountbi.toFixed(2)+'%</td></tfoot>'
|
|
|
|
|
this.res+='</table></div></div>'
|
|
|
|
|
return this.res
|
|
|
|
|
},1000) */
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
zhiNameData = ["浦东支队","黄浦支队","徐汇支队","长宁支队","静安支队","普陀支队","虹口支队","杨浦支队","闵行支队","宝山支队","嘉定支队","松江支队","金山支队","崇明支队"]
|
|
|
|
|
zhiNumData = [200,190,180,170,160,150,140,130,120,110,100,90,80,70]
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
* @name: 气泡封装
|
|
|
|
|
* @test: test font
|
|
|
|
|
* @msg:
|
|
|
|
|
* @param {气泡提示对象，y轴数据，x轴数据}
|
|
|
|
|
* @return {json对象}
|
|
|
|
|
*/
|
|
|
|
|
qipao(tiaoshiPao:any,yData,xData):any{
|
|
|
|
|
if(yData.length>=1){
|
|
|
|
|
var arrshuzu='[';
|
|
|
|
|
for(var i=0;i<yData.length;i++){
|
|
|
|
|
arrshuzu+='{"value":'+yData[i]+',"coord":['+i+','+yData[i]+'],"name":'+'"'+xData[i]+'"'+'},'
|
|
|
|
|
//arrshuzu+=`{"value":${yData[i]},"coord":[${i},${yData[i]}],"name":`+`"`+`${xData[i]}`+`"`+`},`
|
|
|
|
|
}
|
|
|
|
|
arrshuzu=arrshuzu.substring(0,arrshuzu.length-1)
|
|
|
|
|
arrshuzu+=']'
|
|
|
|
|
tiaoshiPao=JSON.parse(arrshuzu)
|
|
|
|
|
//console.log(tiaoshiPao)
|
|
|
|
|
return tiaoshiPao
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//获取所有数据
|
|
|
|
|
allDate=[]
|
|
|
|
|
obdata
|
|
|
|
|
getData(paramsdata,api){
|
|
|
|
|
this.allDate=[]
|
|
|
|
|
this.obdata=null
|
|
|
|
|
this.http.get(api,{params:paramsdata}).subscribe((data:any)=>{
|
|
|
|
|
this.allDate.push(data)
|
|
|
|
|
this.obdata=JSON.parse(JSON.stringify(this.allDate))
|
|
|
|
|
console.log(this.obdata)
|
|
|
|
|
return this.allDate
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
