(function() {
//
Vue.component('high-incidence-disease', {
template: '
',
props: ["data"],
data: function() {
return {
index1:0,
index2:0,
gaoBingFaData:null,
isInit:true
}
},
mounted: function() {
},
watch:{
data:function(data){
this.data = data;
this.formatData();
this.refreshData();
}
},
methods: {
btnClick1:function(idx){
this.index1 = idx;
this.refreshData();
},
btnClick2:function(idx){
this.index2 = idx;
this.refreshData();
},
formatData:function(){
//全部.本月
this.data["本月高发疾病排行"].全部.本月.xAxis[0].data = (this.data["本月高发疾病排行"].全部.本月.xAxis[0].data).reverse();
this.data["本月高发疾病排行"].全部.本月.series[0].data = (this.data["本月高发疾病排行"].全部.本月.series[0].data).reverse();
this.data["本月高发疾病排行"].全部.本月.series[1].data = (this.data["本月高发疾病排行"].全部.本月.series[1].data).reverse();
//全部.本季
this.data["本月高发疾病排行"].全部.本季.xAxis[0].data = (this.data["本月高发疾病排行"].全部.本季.xAxis[0].data).reverse();
this.data["本月高发疾病排行"].全部.本季.series[0].data = (this.data["本月高发疾病排行"].全部.本季.series[0].data).reverse();
this.data["本月高发疾病排行"].全部.本季.series[1].data = (this.data["本月高发疾病排行"].全部.本季.series[1].data).reverse();
//全部.本年
this.data["本月高发疾病排行"].全部.本年.xAxis[0].data = (this.data["本月高发疾病排行"].全部.本年.xAxis[0].data).reverse();
this.data["本月高发疾病排行"].全部.本年.series[0].data = (this.data["本月高发疾病排行"].全部.本年.series[0].data).reverse();
this.data["本月高发疾病排行"].全部.本年.series[1].data = (this.data["本月高发疾病排行"].全部.本年.series[1].data).reverse();
//住院.本月
this.data["本月高发疾病排行"].住院[0].本月.xAxis[0].data = (this.data["本月高发疾病排行"].住院[0].本月.xAxis[0].data).reverse();
this.data["本月高发疾病排行"].住院[0].本月.series[0].data = (this.data["本月高发疾病排行"].住院[0].本月.series[0].data).reverse();
//住院.本季
this.data["本月高发疾病排行"].住院[1].本季.xAxis[0].data = (this.data["本月高发疾病排行"].住院[1].本季.xAxis[0].data).reverse();
this.data["本月高发疾病排行"].住院[1].本季.series[0].data = (this.data["本月高发疾病排行"].住院[1].本季.series[0].data).reverse();
//住院.本年
this.data["本月高发疾病排行"].住院[2].本年.xAxis[0].data = (this.data["本月高发疾病排行"].住院[2].本年.xAxis[0].data).reverse();
this.data["本月高发疾病排行"].住院[2].本年.series[0].data = (this.data["本月高发疾病排行"].住院[2].本年.series[0].data).reverse();
//门诊.本月
this.data["本月高发疾病排行"].门诊[0].本月.xAxis[0].data = (this.data["本月高发疾病排行"].门诊[0].本月.xAxis[0].data).reverse();
this.data["本月高发疾病排行"].门诊[0].本月.series[0].data = (this.data["本月高发疾病排行"].门诊[0].本月.series[0].data).reverse();
//门诊.本季
this.data["本月高发疾病排行"].门诊[1].本季.xAxis[0].data = (this.data["本月高发疾病排行"].门诊[1].本季.xAxis[0].data).reverse();
this.data["本月高发疾病排行"].门诊[1].本季.series[0].data = (this.data["本月高发疾病排行"].门诊[1].本季.series[0].data).reverse();
//门诊.本年
this.data["本月高发疾病排行"].门诊[2].本年.xAxis[0].data = (this.data["本月高发疾病排行"].门诊[2].本年.xAxis[0].data).reverse();
this.data["本月高发疾病排行"].门诊[2].本年.series[0].data = (this.data["本月高发疾病排行"].门诊[2].本年.series[0].data).reverse();
},
refreshData:function(){
if(this.index1==0){//全部
if(this.index2==0){//本月
this.gaoBingFaData = this.data["本月高发疾病排行"].全部.本月;
}else if(this.index2==1){//本季
this.gaoBingFaData = this.data["本月高发疾病排行"].全部.本季;
}else if(this.index2==2){//本年
this.gaoBingFaData = this.data["本月高发疾病排行"].全部.本年;
}
}else if(this.index1==1){//住院
if(this.index2==0){//本月
this.gaoBingFaData = this.data["本月高发疾病排行"].住院[0].本月;
}else if(this.index2==1){//本季
this.gaoBingFaData = this.data["本月高发疾病排行"].住院[1].本季;
}else if(this.index2==2){//本年
this.gaoBingFaData = this.data["本月高发疾病排行"].住院[2].本年;
}
}else if(this.index1==2){//门诊
if(this.index2==0){//本月
this.gaoBingFaData = this.data["本月高发疾病排行"].门诊[0].本月;
}else if(this.index2==1){//本季
this.gaoBingFaData = this.data["本月高发疾病排行"].门诊[1].本季;
}else if(this.index2==2){//本年
this.gaoBingFaData = this.data["本月高发疾病排行"].门诊[2].本年;
}
}
this.initData();
},
initData:function(){//高发疾病
var zhuYuanData = [],zhuYuanTitle = "";
var xAxisData = this.gaoBingFaData.xAxis[0].data;
var menZhenData = this.gaoBingFaData.series[0].data;
var menZhenTitle = this.gaoBingFaData.series[0].name;
if(this.index1==0){//全部,显示门诊/住院数据叠加
zhuYuanData = this.gaoBingFaData.series[1].data;
zhuYuanTitle = this.gaoBingFaData.series[1].name;
this.geoFaMainFun(xAxisData,menZhenData,zhuYuanData,menZhenTitle,zhuYuanTitle)
}
else if(this.index1==1 || this.index1==2){//住院或门诊时,显示单个柱状图
this.geoFaMainFun(xAxisData,menZhenData,zhuYuanData,menZhenTitle,zhuYuanTitle)
}
},
geoFaMainFun:function(xAxisData,menZhenData,zhuYuanData,menZhenTitle,zhuYuanTitle){
var gaoFaChart = echarts.init(document.getElementById('div-gaofa-disease-chart'));
var gaofaOption = {
"tooltip": {
"trigger": "axis"
},
grid: {top: 40, bottom: 30, left: 100,right:80},
"yAxis": [{
"type": "category",
"name": "人次",
"data": xAxisData,
axisPointer: {
type: 'shadow'
},
axisTick: {
show: false
},
axisLine: {
lineStyle: {
color: '#095f8e'
}
},
axisLabel: {
color: '#b5e1fc',
fontSize:'13'
},
nameTextStyle:{color: '#b5e1fc'}
}],
"xAxis": [{
"type": "value",
axisPointer: {
type: 'shadow'
},
axisTick: {
show: false
},
axisLine: {
lineStyle: {
color: '#095f8e'
}
},
axisLabel: {
color: '#fff',
fontSize:'14'
},
splitLine: {
show: false // 不显示坐标轴刻度
}
}],
"series": [{
"smooth": true,
"name": menZhenTitle,
"type": "bar",
stack: '高发疾病',
barWidth: 20,
"label": {
show: true,
position: "right",
color: '#b5e1fc'
},
"itemStyle": {
"normal": {
"lineStyle": {
"shadowColor": "rgba(0,0,0,0.4)"
},
color: '#00e6f3',
barBorderRadius: [0, 8, 8, 0],
}
},
"data": menZhenData
},
]
}
if(zhuYuanData.length>0){
gaofaOption.series[0].label.show = false;
gaofaOption.series[0].itemStyle.normal.color = "#6576e0";
delete gaofaOption.series[0].itemStyle.normal.barBorderRadius;
gaofaOption.series[1] = {
"smooth": true,
"name": zhuYuanTitle,
"type": "bar",
stack: '高发疾病',
"label": {
show: true,
position: "right",
color: '#b5e1fc',
formatter:function(param){
var dataIndex = param.dataIndex,menZhenVal;
_.map(menZhenData,function(item,idx){
if(idx==dataIndex){
menZhenVal = item
}
})
return menZhenVal+"+"+param.value;
},
},
"itemStyle": {
"normal": {
"lineStyle": {
"shadowColor": "rgba(0,0,0,0.4)"
},
barBorderRadius: [0, 8, 8, 0],
color: '#00e6f3'
},
},
"data": zhuYuanData
}
}else{
gaofaOption.series = gaofaOption.series[0];
}
if(gaoFaChart){
gaoFaChart.clear();
}
gaoFaChart.setOption(gaofaOption);
}
},
})
})()