|
|
@ -0,0 +1,351 @@
|
|
|
new Vue({
|
|
|
el: '#app',
|
|
|
data: {
|
|
|
city: '上饶市',
|
|
|
town: [],
|
|
|
selectTown:["0"],
|
|
|
cityVal:"0",
|
|
|
timeType: '1', //时间过滤条件 1是上月 2是半年
|
|
|
leftData1: {}, //左边数据块1
|
|
|
leftData2: {}, //左边数据块2
|
|
|
bakLeftData1:{},//缓存左边数据块1
|
|
|
bakLeftData2:{},//缓存左边数据块2
|
|
|
yesterdayData: {},
|
|
|
leftChart1: null, //左边的图表1
|
|
|
leftChart2: null, //左边的图表2
|
|
|
leftData3:null,//左边的图表3
|
|
|
leftData2_legend:null,//左边的图表2中间数据
|
|
|
rightChart1: null, //右边边的图表1
|
|
|
rightChart2: null, //右边的图表2
|
|
|
tableData1: null, //表格数据1
|
|
|
tableData2: null, //表格数据2
|
|
|
mapData: null,
|
|
|
allData: null, //所有的数据 用来切换区县
|
|
|
lineHeightIndex: null,
|
|
|
skipShow: 0,
|
|
|
hasData1:true,
|
|
|
hasData2:true,
|
|
|
hasData3:true,
|
|
|
hasData4:true,
|
|
|
hasData5:true,
|
|
|
hasData6:true,
|
|
|
hasMapData:true,
|
|
|
time:'',
|
|
|
middleData1:'',
|
|
|
middleData2:'',
|
|
|
middleData3:'',
|
|
|
},
|
|
|
mounted: function() {
|
|
|
this.initData();
|
|
|
},
|
|
|
filters:{
|
|
|
formatData:function(value){
|
|
|
if(value>100000){
|
|
|
if(value>1000000000){
|
|
|
return (value/100000000).toFixed(2)+"亿"
|
|
|
}else{
|
|
|
return (value/10000).toFixed(2)+"万"
|
|
|
}
|
|
|
}else{
|
|
|
return value
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
initData: function() {
|
|
|
this.timeType = 1;//默认显示本月
|
|
|
$(".div-mask-layer").show();
|
|
|
var vm = this,data1, data2, data3, data4, data5, data6, data7, data8;
|
|
|
this.town.map(function(v, i) {
|
|
|
if(v.name == vm.city) {
|
|
|
vm.cityVal = v.id;
|
|
|
}
|
|
|
})
|
|
|
// 上个月
|
|
|
var linkageFilter1 = "quotaDate >= '" + getMonthStartDate() + "' and quotaDate <= '" + getMonthEndDate() + "';";
|
|
|
console.log(linkageFilter1)
|
|
|
if(vm.cityVal!="0") {
|
|
|
linkageFilter1 += "town=" + vm.cityVal + ";";
|
|
|
}
|
|
|
// 今年
|
|
|
var linkageFilter2 = "quotaDate >= '" + getYearStartDate() + "' and quotaDate <= '" + getYearEndDate() + "';";
|
|
|
if(vm.cityVal!="0") {
|
|
|
linkageFilter2 += "town=" + vm.cityVal + ";";
|
|
|
}
|
|
|
console.log(linkageFilter2)
|
|
|
// 半年
|
|
|
var linkageFilter3 = "quotaDate >= '" + getHalfYearStartDate() + "' and quotaDate <= '" + getHalfYearEndDate() + "';";
|
|
|
if(vm.cityVal!="0") {
|
|
|
linkageFilter3 += "town=" + vm.cityVal + ";";
|
|
|
}
|
|
|
console.log(linkageFilter3)
|
|
|
var linkageFilter4 = "quotaDate >= '" + getYearEndDate() + "' and quotaDate <= '" + getYearEndDate() + "';";
|
|
|
console.log(linkageFilter4)
|
|
|
var reqUrl = [{url: bigDataAPI.getCityHospital,reqType: 'get',data: {}},
|
|
|
{url: bigDataAPI.getNoChartTemplateData,reqType: 'get',data: {viewCodeStr: "VIEW_22_0004",linkageFilter:linkageFilter1}},//医保费用
|
|
|
{url: bigDataAPI.getTemplateDataByViewCode,reqType: 'get',data: {viewCode: "VIEW_22_0003",linkageFilter:linkageFilter3}},//医保支出费用月趋势
|
|
|
{url: bigDataAPI.getTemplateDataByViewCode,reqType: 'get',data: {viewCode: "VIEW_22_0002",linkageFilter:linkageFilter1}},//医保目录外费用占比
|
|
|
{url: bigDataAPI.getTemplateDataByViewCode,reqType: 'get',data: {viewCode: "VIEW_22_0005",linkageFilter:linkageFilter1}},//
|
|
|
{url:bigDataAPI.getMapJingWeiDuInfo,reqType: 'get',data:{}},//上饶地图经纬度数据
|
|
|
{url: bigDataAPI.getTemplateDataByViewCode,reqType: 'get',data: {viewCode: "VIEW_22_0001",linkageFilter:linkageFilter1}},//机构排行
|
|
|
{url: bigDataAPI.getTemplateDataByViewCode,reqType: 'get',data: {viewCode: "VIEW_14_0015",linkageFilter:linkageFilter3}},//门诊人次月趋势
|
|
|
{url: bigDataAPI.getTemplateDataByViewCode,reqType: 'get',data: {viewCode: "VIEW_14_0016",linkageFilter:linkageFilter3}},//住院人次月趋势
|
|
|
{url: bigDataAPI.getTemplateDataByViewCode,reqType: 'get',data: {viewCode: "VIEW_14_0017",linkageFilter:linkageFilter3}},//门诊分类别月趋势
|
|
|
{url: bigDataAPI.getTemplateDataByViewCode,reqType: 'get',data: {viewCode: "VIEW_14_0018",linkageFilter:linkageFilter3}},//住院平均日数月趋势
|
|
|
|
|
|
];
|
|
|
// debugger
|
|
|
httpRequest.getReqPromises(reqUrl).then(function(datas) {
|
|
|
vm.town = datas[0].map((item, index, arr) => {
|
|
|
item.children.map((t) => {
|
|
|
return t.label = t.text;
|
|
|
})
|
|
|
item.label = item.text;
|
|
|
return item;
|
|
|
})
|
|
|
vm.town.unshift({
|
|
|
label: '上饶市',
|
|
|
value: '0'
|
|
|
})
|
|
|
vm.middleData1 = toThousands(datas[1].obj.VIEW_22_0004[0].HC_22_1001/10000);
|
|
|
vm.middleData2 = datas[1].obj.VIEW_22_0004[0].HC_22_1002;
|
|
|
vm.middleData3 = toThousands(datas[1].obj.VIEW_22_0004[0].HC_22_1006/10000);
|
|
|
var chart2 = datas[2].obj.viewInfos[0].options[0].option;
|
|
|
// vm.leftData1 = datas[1];
|
|
|
var chart3 = datas[3].obj.viewInfos[0].options[0].option;
|
|
|
var chart4 = datas[4].obj.viewInfos[0].options[0].option;
|
|
|
var data1 = datas[1]
|
|
|
var data5 = datas[5];
|
|
|
var data6 = datas[6];
|
|
|
console.log(data6)
|
|
|
// data5 = datas[5];
|
|
|
// data6 = datas[6];
|
|
|
// data7 = datas[7];
|
|
|
// data8 = datas[8];
|
|
|
// data9 = datas[9];
|
|
|
|
|
|
vm.setLeftChart1(chart2);
|
|
|
vm.setLeftChart2(chart3);
|
|
|
vm.setLeftChart3(chart4);
|
|
|
// vm.setRightChart1(data8);
|
|
|
// vm.setRightChart2(data9);
|
|
|
// vm.setTable1(data4);
|
|
|
// vm.setTable2(data5);
|
|
|
// vm.setleftData1();
|
|
|
echarts.registerMap('上饶',data5);
|
|
|
vm.setMapData(data1);
|
|
|
vm.setYesterDay(data1);
|
|
|
$(".div-mask-layer").hide();
|
|
|
})
|
|
|
},
|
|
|
setleftData1: function() {
|
|
|
var options = {},options1={},options2={},vm=this;
|
|
|
if(this.leftData1.successFlg) {
|
|
|
_.map(vm.leftData1.obj.VIEW_14_0011,function(item,index){
|
|
|
if(vm.cityVal=="0"){//上饶市
|
|
|
options1 = vm.leftData1.obj.VIEW_14_0011[0];
|
|
|
}else if(item.firstColumn==vm.city){
|
|
|
options1 = item;
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
if(this.leftData2.successFlg) {
|
|
|
_.map(vm.leftData2.obj.VIEW_14_0011,function(item,index){
|
|
|
if(vm.cityVal=="0"){//上饶市
|
|
|
options2 = vm.leftData2.obj.VIEW_14_0011[0];
|
|
|
}else if(item.firstColumn==vm.city){
|
|
|
options2 = item;
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
vm.bakLeftData1 = this.setFormater(options1);
|
|
|
vm.bakLeftData2 = this.setFormater(options2);
|
|
|
this.leftData = vm.bakLeftData1;
|
|
|
},
|
|
|
setYesterDay: function(data3) {
|
|
|
var options = {},vm=this;
|
|
|
if(data3.successFlg) {
|
|
|
_.map(data3.obj&&data3.obj.VIEW_14_0012||[],function(item,index){
|
|
|
if(vm.cityVal=="0"){//上饶市
|
|
|
options = data3.obj.VIEW_14_0012[0];
|
|
|
}else if(item.firstColumn==vm.city){
|
|
|
options = item;
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
if(options){
|
|
|
this.setFormater(options);
|
|
|
this.yesterdayData = options;
|
|
|
}
|
|
|
},
|
|
|
setLeftChart1: function(data) {
|
|
|
var options = JSON.parse(data);
|
|
|
options = leftChart1(options);
|
|
|
this.leftData1 = options;
|
|
|
},
|
|
|
setLeftChart2: function(data) {
|
|
|
var options = JSON.parse(data);
|
|
|
this.leftData2_legend = toThousands((Number(options.series[0].data[0].value)+Number(options.series[0].data[1].value))/10000)
|
|
|
options = leftChart2(options);
|
|
|
this.leftData2 = options;
|
|
|
},
|
|
|
setLeftChart3: function(data) {
|
|
|
var options = JSON.parse(data);
|
|
|
options = leftChart3(options);
|
|
|
this.leftData3 = options;
|
|
|
},
|
|
|
setMapData: function(data3) {
|
|
|
// debugger
|
|
|
var optionData = [];
|
|
|
_.map(data3.obj&&data3.obj.VIEW_22_0004||[], function(item) {
|
|
|
if(item.firstColumn != "合计") {
|
|
|
optionData.push({
|
|
|
name: item.town,
|
|
|
value: parseInt(item.HC_22_1001)
|
|
|
})
|
|
|
}
|
|
|
})
|
|
|
if(optionData.length>0){
|
|
|
var options = optionData;
|
|
|
this.mapData = {
|
|
|
data: options,
|
|
|
index: this.lineHeightIndex
|
|
|
};
|
|
|
this.hasMapData = true;
|
|
|
}else{
|
|
|
this.hasMapData = false;
|
|
|
}
|
|
|
},
|
|
|
setRightChart1: function(data8) {
|
|
|
var options = null;
|
|
|
var options = data8.successFlg?data8.obj.viewInfos&&JSON.parse(data8.obj.viewInfos[0].options[0].option):{};
|
|
|
if(options&&options.series && options.series[0].data && options.series[1].data && options.series[2].data && options.series[3].data){
|
|
|
options = rightChart1DataFormat(options);
|
|
|
this.rightChart1 = options
|
|
|
this.hasData4 = true;
|
|
|
$(".right1 .contentBox3").removeClass("div-menzhenfenleibei");
|
|
|
}else{
|
|
|
this.hasData4 = false;
|
|
|
$(".right1 .contentBox3").addClass("div-menzhenfenleibei");
|
|
|
}
|
|
|
},
|
|
|
setRightChart2: function(data9) {
|
|
|
var options = null;
|
|
|
var options = data9.successFlg?data9.obj.viewInfos&&JSON.parse(data9.obj.viewInfos[0].options[0].option):{};
|
|
|
if(options&&options.series && options.series[0].data && options.series[1].data){
|
|
|
options = rightChart2DataFormat(options);
|
|
|
this.rightChart2 = options
|
|
|
this.hasData6 = true;
|
|
|
$(".right2 .contentBox3").removeClass("div-menzhenfenleibei");
|
|
|
}else{
|
|
|
this.hasData6 = false;
|
|
|
$(".right2 .contentBox3").addClass("div-menzhenfenleibei");
|
|
|
}
|
|
|
},
|
|
|
setTable1: function(data4) {
|
|
|
var resData = [];
|
|
|
var data = data4.successFlg?data4.obj.VIEW_14_0013:[];
|
|
|
_.map(data, function(item, index) {
|
|
|
if(item.firstColumn != "合计" && item.month) {
|
|
|
item.month = parseInt(item.month.substring(5, 7))+"月";
|
|
|
resData.push(item)
|
|
|
}
|
|
|
})
|
|
|
if(resData.length==0){
|
|
|
this.hasData3 = false;
|
|
|
}else{
|
|
|
this.hasData3 = true;
|
|
|
this.tableData1 = resData
|
|
|
}
|
|
|
},
|
|
|
setTable2: function(data5) {
|
|
|
var resData = [];
|
|
|
var data = data5.successFlg?data5.obj.VIEW_14_0014:[];
|
|
|
_.map(data, function(item, index) {
|
|
|
if(item.firstColumn != "合计" && item.month) {
|
|
|
item.month = parseInt(item.month.substring(5, 7))+"月";
|
|
|
resData.push(item)
|
|
|
}
|
|
|
})
|
|
|
if(resData.length==0){
|
|
|
this.hasData5 = false;
|
|
|
}else{
|
|
|
this.hasData5 = true;
|
|
|
this.tableData2 = resData
|
|
|
}
|
|
|
},
|
|
|
setCity(item) {
|
|
|
this.city = item.name;
|
|
|
|
|
|
},
|
|
|
setTimeStr(v) {
|
|
|
this.timeType = v;
|
|
|
this.timeType == 1?this.leftData=this.bakLeftData1:this.leftData=this.bakLeftData2;
|
|
|
},
|
|
|
setFormater: function(obj) {
|
|
|
for(var c in obj) {
|
|
|
if(obj[c].toString().indexOf(",") == -1){//不存在,，说明要格式化
|
|
|
var re = /^[0-9]+.?[0-9]*/;//判断字符串是否为数字//判断正整数/[1−9]+[0−9]∗]∗/
|
|
|
if (!re.test(obj[c])) { //不是数字，则不格式化
|
|
|
continue;
|
|
|
}
|
|
|
if(obj[c]>100000){
|
|
|
obj[c] = (obj[c]/10000).toFixed(2)+"万"
|
|
|
}else{
|
|
|
obj[c] = toThousands(obj[c]);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
return obj;
|
|
|
},
|
|
|
newObj: function(obj) {
|
|
|
return JSON.parse(JSON.stringify(obj))
|
|
|
},
|
|
|
clickMap: function(res) {
|
|
|
this.city = res.name;
|
|
|
},
|
|
|
skipClick: function() {
|
|
|
console.log(222)
|
|
|
this.skipShow == 0 ? this.skipShow = 1 : this.skipShow = 0
|
|
|
}
|
|
|
},
|
|
|
watch: {
|
|
|
city: function(value) {
|
|
|
var that = this;
|
|
|
that.lineHeightIndex = value;
|
|
|
this.initData();
|
|
|
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
//数字格式化
|
|
|
function toThousands(str) {
|
|
|
if(!str) return
|
|
|
str = parseInt(str);
|
|
|
if(typeof(str) == 'number') str = str.toString()
|
|
|
|
|
|
var newStr = "";
|
|
|
var count = 0;
|
|
|
if(str.indexOf(".") == -1) {
|
|
|
for(var i = str.length - 1; i >= 0; i--) {
|
|
|
if(count % 3 == 0 && count != 0) {
|
|
|
newStr = str.charAt(i) + "," + newStr;
|
|
|
} else {
|
|
|
newStr = str.charAt(i) + newStr;
|
|
|
}
|
|
|
count++;
|
|
|
}
|
|
|
str = newStr;
|
|
|
} else {
|
|
|
for(var i = str.indexOf(".") - 1; i >= 0; i--) {
|
|
|
if(count % 3 == 0 && count != 0) {
|
|
|
newStr = str.charAt(i) + "," + newStr;
|
|
|
} else {
|
|
|
newStr = str.charAt(i) + newStr; //逐个字符相接起来
|
|
|
}
|
|
|
count++;
|
|
|
}
|
|
|
str = newStr + (str + "00").substr((str + "00").indexOf("."), 3);
|
|
|
}
|
|
|
return str;
|
|
|
}
|
zhanghaoyu
