|
@ -11,6 +11,7 @@
|
|
|
<link href="../../../css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
|
|
|
<link href="../../../css/plugins/toastr/toastr.min.css" rel="stylesheet">
|
|
|
<link href="../../../css/style.min.css" rel="stylesheet">
|
|
|
<link href="../../../css/flex.css" rel="stylesheet">
|
|
|
<link href="../css/home.css" rel="stylesheet">
|
|
|
</head>
|
|
|
|
|
@ -21,145 +22,37 @@
|
|
|
|
|
|
<div class="content">
|
|
|
<div class="right-panel">
|
|
|
<div style="height: 100%;">
|
|
|
<h4 class="c-b5e1fc c-f16 c-t-center div-common-title">本月高发疾病排行</h4>
|
|
|
<img src="../images/icon.png" class="icon-img">
|
|
|
<div data-toggle="buttons" class="btn-group">
|
|
|
<label class="btn btn-default active">
|
|
|
<input type="radio">全部
|
|
|
</label>
|
|
|
<label class="btn btn-default">
|
|
|
<input type="radio">住院
|
|
|
</label>
|
|
|
<label class="btn btn-default">
|
|
|
<input type="radio">门诊
|
|
|
</label>
|
|
|
</div>
|
|
|
<div data-toggle="buttons" class="btn-group fr mr20">
|
|
|
<label class="btn btn-default active">
|
|
|
<input type="radio">本月
|
|
|
</label>
|
|
|
<label class="btn btn-default">
|
|
|
<input type="radio">本季
|
|
|
</label>
|
|
|
<label class="btn btn-default">
|
|
|
<input type="radio">本年
|
|
|
</label>
|
|
|
</div>
|
|
|
<div id="div-gaofa-disease-chart" class="ml30" style="height:calc(100% - 102px)"></div>
|
|
|
</div>
|
|
|
<!-- 本月高发疾病排行 -->
|
|
|
<high-incidence-disease :data="jsonData"></high-incidence-disease>
|
|
|
</div>
|
|
|
<div class="left-panel">
|
|
|
<disease-crowd></disease-crowd>
|
|
|
<!-- 疾病人群 -->
|
|
|
<disease-crowd :data="jsonData"></disease-crowd>
|
|
|
</div>
|
|
|
<div class="center-panel">
|
|
|
<div class="center-panel" v-cloak>
|
|
|
<!-- 地图 -->
|
|
|
<div class="map mt20">
|
|
|
<div class="dropdown Mapselect">
|
|
|
<div type="button" class="btn dropdown-toggle" id="dropdownMenu1" data-toggle="dropdown">{{city}}
|
|
|
<span class="caret"></span>
|
|
|
<map-chart @map-click="clickMap" ref="map" :config="mapData"></map-chart>
|
|
|
<div class="dropdown Mapselect">
|
|
|
<div type="button" class="btn dropdown-toggle" id="dropdownMenu1" data-toggle="dropdown">{{city}}
|
|
|
<span class="caret"></span>
|
|
|
</div>
|
|
|
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
|
|
|
<li role="presentation" @click="setCity(item)" v-for="item in town">
|
|
|
<a role="menuitem" href="#">{{item.townName}}</a>
|
|
|
</li>
|
|
|
</ul>
|
|
|
</div>
|
|
|
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
|
|
|
<li role="presentation" @click="setCity(item)" v-for="item in town">
|
|
|
<a role="menuitem" href="#">{{item.townName}}</a>
|
|
|
</li>
|
|
|
</ul>
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="bottom-left-panel">
|
|
|
<div style="height: 100%;">
|
|
|
<h4 class="c-b5e1fc c-f16 c-t-center div-common-title">重点服务人群增加趋势</h4>
|
|
|
<div data-toggle="buttons" class="btn-group fr mr40 mt0" style="position: absolute;right: 0px;top: 15px">
|
|
|
<label class="btn btn-default active">
|
|
|
<input type="radio">本月
|
|
|
</label>
|
|
|
<label class="btn btn-default">
|
|
|
<input type="radio">本季
|
|
|
</label>
|
|
|
<label class="btn btn-default">
|
|
|
<input type="radio">本年
|
|
|
</label>
|
|
|
</div>
|
|
|
<div id="div-zhongidan-echart" class="ml30" style="height:calc(100% - 50px);width: 100%;"></div>
|
|
|
</div>
|
|
|
<!-- 重点服务人群 -->
|
|
|
<key-service-population :data="jsonData"></key-service-population>
|
|
|
</div>
|
|
|
<div class="bottom-right-panel">
|
|
|
<div style="height: 100%;">
|
|
|
<h4 class="c-b5e1fc c-f16 c-t-center div-common-title">死亡原因</h4>
|
|
|
<img src="../images/icon.png" class="icon-img">
|
|
|
<div class="" style="height: 85%;">
|
|
|
<div id="div-shiwang-echart" class="ml30 mr30"></div>
|
|
|
<div class="div-siwang-type">
|
|
|
<div style="position: absolute;right: 0;">
|
|
|
<div class="div-webkit-box">
|
|
|
<div class="c-b5e1fc div-webkit-box-flex1 c-f14">
|
|
|
<label class="gxy bar-a"></label>
|
|
|
<label class="ml10">闹血管疾病</label>
|
|
|
<label class="ml30">360</label>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="div-webkit-box mt10">
|
|
|
<div class="c-b5e1fc div-webkit-box-flex1 c-f14">
|
|
|
<label class="gxy bar-a"></label>
|
|
|
<label class="ml10">呼吸系统疾病</label>
|
|
|
<label class="ml30">360</label>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="div-webkit-box">
|
|
|
<div class="c-b5e1fc div-webkit-box-flex1 c-f14">
|
|
|
<label class="gxy bar-a"></label>
|
|
|
<label class="ml10">恶性肿瘤</label>
|
|
|
<label class="ml30">360</label>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="div-webkit-box mt10">
|
|
|
<div class="c-b5e1fc div-webkit-box-flex1 c-f14">
|
|
|
<label class="gxy bar-a"></label>
|
|
|
<label class="ml10">心脏病</label>
|
|
|
<label class="ml30">360</label>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="div-webkit-box mt10">
|
|
|
<div class="c-b5e1fc div-webkit-box-flex1 c-f14">
|
|
|
<label class="gxy bar-a"></label>
|
|
|
<label class="ml10">损失和中毒</label>
|
|
|
<label class="ml30">360</label>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="div-webkit-box mt10">
|
|
|
<div class="c-b5e1fc div-webkit-box-flex1 c-f14">
|
|
|
<label class="gxy bar-a"></label>
|
|
|
<label class="ml10">消化系统疾病</label>
|
|
|
<label class="ml30">360</label>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="div-webkit-box mt10">
|
|
|
<div class="c-b5e1fc div-webkit-box-flex1 c-f14">
|
|
|
<label class="gxy bar-a"></label>
|
|
|
<label class="ml10">内分泌、营养和代谢疾病</label>
|
|
|
<label class="ml30">360</label>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="div-webkit-box mt10">
|
|
|
<div class="c-b5e1fc div-webkit-box-flex1 c-f14">
|
|
|
<label class="gxy bar-a"></label>
|
|
|
<label class="ml10">泌尿生殖系统疾病</label>
|
|
|
<label class="ml30">360</label>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="div-webkit-box mt10">
|
|
|
<div class="c-b5e1fc div-webkit-box-flex1 c-f14">
|
|
|
<label class="gxy bar-a"></label>
|
|
|
<label class="ml10">其他疾病</label>
|
|
|
<label class="ml30">360</label>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- 死亡原因 -->
|
|
|
<death-cause :data="jsonData"></death-cause>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="div-bottom"></div>
|
|
@ -177,8 +70,13 @@
|
|
|
<script src="../../../js/underscore.js"></script>
|
|
|
<script src="../../../js/plugins/layer/layer.min.js"></script>
|
|
|
<script src="../../../js/api/http-request.js"></script>
|
|
|
<!--<script src="../../../js/api/intelligent-api.js"></script>-->
|
|
|
<script src="../../../js/api/bigData-api.js"></script>
|
|
|
<script src="../../../component/chart/guigang.js"></script>
|
|
|
<script src="../../../component/chart/map-chart.js"></script>
|
|
|
<script src="../component/disease-crowd.js"></script>
|
|
|
<script src="../component/high-incidence-disease.js"></script>
|
|
|
<script src="../component/key-service-population.js"></script>
|
|
|
<script src="../component/death-cause.js"></script>
|
|
|
<script src="../js/home.js"></script>
|
|
|
</body>
|
|
|
|