|
@ -2,7 +2,7 @@
|
|
|
|
|
|
Vue.component('disease-crowd', {
|
|
|
template: '<div v-if="data" class="left-panel-img">\
|
|
|
<div class="div-disease-item" @click="diseaseClick(0)" :class="{active: activeIndex == 0}" >\
|
|
|
<div class="div-disease-item" @click="diseaseClick(0)" :class="{active: activeIndex == 0}" @mouseout="diseaseMouseOut" @mouseover="diseaseMouseOver">\
|
|
|
<h4 class="c-b5e1fc c-f16 c-t-center div-disease-title">高血压人群</h4>\
|
|
|
<img src="../images/icon.png" class="icon-img" @click="detailClick(0)">\
|
|
|
<div class="c-row">\
|
|
@ -35,7 +35,7 @@
|
|
|
</div>\
|
|
|
</div>\
|
|
|
</div>\
|
|
|
<div class="div-disease-item mt10" @click="diseaseClick(1)" :class="{active: activeIndex == 1}" >\
|
|
|
<div class="div-disease-item mt10" @click="diseaseClick(1)" :class="{active: activeIndex == 1}" @mouseout="diseaseMouseOut" @mouseover="diseaseMouseOver">\
|
|
|
<h4 class="c-b5e1fc c-f16 c-t-center div-disease-title">糖尿病人群</h4>\
|
|
|
<img src="../images/icon.png" class="icon-img" @click="detailClick(1)">\
|
|
|
<div class="c-row">\
|
|
@ -68,7 +68,7 @@
|
|
|
</div>\
|
|
|
</div>\
|
|
|
</div>\
|
|
|
<div class="div-disease-item mt10">\
|
|
|
<div class="div-disease-item mt10" @click="diseaseClick(2)" :class="{active: activeIndex == 2}" @mouseout="diseaseMouseOut" @mouseover="diseaseMouseOver">\
|
|
|
<h4 class="c-b5e1fc c-f16 c-t-center div-disease-title">孕产妇人群</h4>\
|
|
|
<div class="c-row">\
|
|
|
<div class="c-33 bg-icon">\
|
|
@ -100,7 +100,7 @@
|
|
|
</div>\
|
|
|
</div>\
|
|
|
</div>\
|
|
|
<div class="div-disease-item mt10">\
|
|
|
<div class="div-disease-item mt10" @click="diseaseClick(3)" :class="{active: activeIndex == 3}" @mouseout="diseaseMouseOut" @mouseover="diseaseMouseOver">\
|
|
|
<h4 class="c-b5e1fc c-f16 c-t-center div-disease-title">65岁以上老年人人数</h4>\
|
|
|
<div class="c-row">\
|
|
|
<div class="c-33 bg-icon">\
|
|
@ -136,7 +136,8 @@
|
|
|
props: ["data"],
|
|
|
data: function() {
|
|
|
return {
|
|
|
activeIndex:0
|
|
|
activeIndex:0,
|
|
|
cacheActiveIndex:0
|
|
|
}
|
|
|
},
|
|
|
mounted: function() {
|
|
@ -150,11 +151,14 @@
|
|
|
methods: {
|
|
|
diseaseClick:function(type){
|
|
|
this.activeIndex = type;
|
|
|
if(type==0){//高血压
|
|
|
EventBus.$emit('refresh-json-data', {type:0});
|
|
|
}else if(type==1){//糖尿病
|
|
|
EventBus.$emit('refresh-json-data', {type:1});
|
|
|
}
|
|
|
this.cacheActiveIndex = type;
|
|
|
EventBus.$emit('refresh-json-data', {type:type});
|
|
|
},
|
|
|
diseaseMouseOver:function(){
|
|
|
this.activeIndex = null;
|
|
|
},
|
|
|
diseaseMouseOut:function(){
|
|
|
this.activeIndex = this.cacheActiveIndex;
|
|
|
},
|
|
|
detailClick:function(type){//type:0高血压 1糖尿病
|
|
|
var height = (0.42 * window.screen.width) + 'px';
|