123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351 |
- 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;
- }
|