new Vue({ el: '#main', data: { alertData1:'',//总人数 alertData2:'',//新增人数 alertData3:'',//门诊人次 alertData4:'',//住院人次 alertChart1:'',//左边第一块表格 alertChart2:'',//右上第一块 alertChart3:'',//右上第二块 alertChart4:'',//右上第三块 alertChart5:'',//右下 bigData:'',//总数据 alertType:0, alertTime:0, type:'', title:'', }, mounted: function() { var vm = this; this.type = this.GetQueryString("type"); if(this.type == 0){ this.title = '高血压人群分布'; vm.bigData = bigData; }else if(this.type == 1){ this.title = '糖尿病人群分布'; vm.bigData = bigData2; } this.initData(); }, methods: { initData:function(){ var vm = this; vm.alertData1 = vm.bigData['总人数']; vm.alertData2 = vm.bigData['新增人数']; vm.alertData3 = vm.bigData['门诊人次']; vm.alertData4 = vm.bigData['住院人次']; this.setAlertChart1(0); this.setAlertChart2(0); this.setAlertChart3(0); this.setAlertChart4(0); this.setAlertChart5(0,0); console.log(vm.bigData) }, setAlertChart1:function(type){ var t = ''; switch(type){ case 0:t = '全部';break; case 1:t = '门诊';break; case 2:t = '住院';break; } var options = this.bigData[t]['区县分布']; options.series[0].label = {show: true,position: "right",color: '#b5e1fc'} this.alertChart1 = options }, setAlertChart2:function(type){ var t = ''; switch(type){ case 0:t = '全部';break; case 1:t = '门诊';break; case 2:t = '住院';break; } var options = this.bigData[t]['年龄段分布']; options.color = ["#00e6f3","#03fa6c","#ff616f","#0fa5f2","#6576e0"]; this.alertChart2 = options }, setAlertChart3:function(type){ var t = ''; switch(type){ case 0:t = '全部';break; case 1:t = '门诊';break; case 2:t = '住院';break; } var options = this.bigData[t]['性别分布']; options.color = ["#0fa5f2","#ff616f"]; this.alertChart3 = options }, setAlertChart4:function(type){ var t = ''; switch(type){ case 0:t = '全部';break; case 1:t = '门诊';break; case 2:t = '住院';break; } var options = this.bigData[t]["并发症"]; options.series[0].label = {show: true,position: "right",color: '#b5e1fc'} this.alertChart4 = options }, setAlertChart5:function(type,time){ var t = '',m=''; switch(type){ case 0:t = '全部';break; case 1:t = '门诊';break; case 2:t = '住院';break; } switch(time){ case 0:m = '日';break; case 1:m = '月';break; case 2:m = '季';break; case 3:m = '年';break; } var options = this.bigData[t]['新增患者趋势'][m]; this.alertChart5 = options }, alertTitle:function(type){ this.alertTime = 0; this.setAlertChart1(type); this.setAlertChart2(type); this.setAlertChart3(type); this.setAlertChart4(type); this.setAlertChart5(type,0); this.alertType = type; }, alertChart:function(time){ var type = this.alertType; this.alertTime = time; this.setAlertChart5(type,time); }, closeAlertClick:function(){ parent.layer.closeAll(); }, GetQueryString :function (name){ var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)"); var r = window.location.search.substr(1).match(reg); if(r!=null)return unescape(r[2]); return null; } } }); //数字格式化 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; }