Explorar o código

1.6.5 统计分析-上门和疾病筛查

chenyue %!s(int64=5) %!d(string=hai) anos
pai
achega
b7c668332f

+ 5 - 2
api/jbsc-api.js

@ -1,5 +1,9 @@
(function(exports) {
    var jbscAPI = {
    	//获取所有疾病筛选列表
		surveyTemplates: function(data) {
			return httpRequest.get("third/surveyStatis/survey_templates")
		},
    	//统计模型
		screenStatics: function(data) {
			return httpRequest.post("doctor/screen/screenStatics")
@ -74,8 +78,7 @@
    	},
    	updateAfterEducate:function(data){
    		return httpRequest.post('doctor/screen/updateAfterEducate', {data:data})
    	}
		
    	},
    }
    exports.jbscAPI = jbscAPI;

+ 1 - 1
app/recover/html/new_recover.html

@ -885,7 +885,7 @@
                	getRandgeDate: function(index) {
                		var vm = this
                		var templateDetail=this.templateDetail[index]
                		if(!templateDetail.value14[0]&&!templateDetail.value14[1]){
                		if(!templateDetail.value14[0]||!templateDetail.value14[1]){
                			return false;
                		}else if(templateDetail.value14[0]>templateDetail.value14[1]){
                			showWarningMessage("开始时间应小于结束时间!")

+ 63 - 2
app/statistics/css/common.css

@ -29,7 +29,14 @@
.c-w-33 {
	width: 33%;
}
.plr25{
	padding-right: 25px;
	padding-left: 25px;
}
.mlr25{
	margin-right: 25px;
	margin-left: 25px;
}
ul {
	list-style: none;
}
@ -861,4 +868,58 @@ body .el-table th.gutter{
	text-align: center;
    color: #909090;
    font-weight: normal;
}
}
.c-border-r-4{border-radius: 4px;}
.bgc-ebebf5{
	background-color: #ebebf5;
}
.table-tab-pane{
	background-color: #ebebf5;
}
.table-panel .table-tab-item {
    padding: 0 20px;
    display: inline-block;
    list-style: none;
    font-size: 18px;
    font-weight: normal; 
    text-align: center;
    color: #333333;
}
.table-panel .table-tab-item div{
    line-height: 60px;
    height: 60px;
    padding: 0 20px;
}
.table-panel .table-tab-item div.active span{
	padding: 18px;
	color:#17B3EC;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-bottom: 2px solid #17B3EC;
}
.table-panel .table-content{
	width: 100%;
	border-spacing: 0;
    border-collapse: collapse;
}
.table-panel .table-content th{
	background-color: rgba(23,179,236,0.1);
	text-align: center;
    color: #333333;
    font-weight: normal;
}
.table-panel th,.table-panel td{
	height: 50px;
    font-size: 16px;
    padding-left:15px;
    padding-right:15px;
}
.table-panel th{
	text-align: center;
    color: #666666;
    font-weight: normal;
}
.table-panel tr td:first-child:hover{
	color:#12B7F5;
	cursor: pointer;
}

+ 1 - 1
app/statistics/html/home.html

@ -94,7 +94,7 @@
                </div>
                <div class="section-body mb30 mt10">
                    <div class="c-row n-row">
                        <div v-for="item in serviceAnalysis" @click="showDetail(item.url)" v-show="!item.allowArea||item.allowArea==selectedRole"  class="c-20 mt20 c-t-center clearfix">
                        <div v-for="item in serviceAnalysis" @click="showDetail(item.url)" v-if="!item.allowArea||item.allowArea.indexOf(selectedRole)>-1"  class="c-20 mt20 c-t-center clearfix">
                            <img :src="item.photo">
                            <div class="c-f12 c-999 mt10">{{item.label}}</div>
                        </div>

+ 210 - 0
app/statistics/html/jbsc-analysis.html

@ -0,0 +1,210 @@
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>疾病筛查分析</title>
    <meta name="author" content="yihu.com" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0"
    />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <link rel="stylesheet" type="text/css" href="../../../css/font-awesome.min.css" />
    <link rel="stylesheet" type="text/css" href="../../../css/style.min.css" />
    <link rel="stylesheet" type="text/css" href="../../../css/cross.css" />
    <link rel="stylesheet" type="text/css" href="../../../css/flex.css" />
    <link rel="stylesheet" type="text/css" href="../../../css/element-ui.css" />
    <link href="../../../plugins/toastr/toastr.min.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="../css/common.css" />
</head>
<style>
.mainBlocktop {
    height: 201px;
	background: -webkit-linear-gradient(left, rgb(23,179,236) , #728cda); /* Safari 5.1 - 6.0 */
	background: -o-linear-gradient(right, rgb(23,179,236), #728cda); /* Opera 11.1 - 12.0 */
	background: -moz-linear-gradient(right, rgb(23,179,236), #728cda); /* Firefox 3.6 - 15 */
	background: linear-gradient(to right, rgb(23,179,236) , #728cda); /* 标准的语法(必须放在最后) */
	border-radius: 10px;
    color: #fff;
    font-size: 16px;
}
.mainBlockbottom {
    height: 201px;
    font-size: 16px;
	background: -webkit-linear-gradient(left, #efa24d ,#e16397); /* Safari 5.1 - 6.0 */
	background: -o-linear-gradient(right, #efa24d, #e16397); /* Opera 11.1 - 12.0 */
	background: -moz-linear-gradient(right, #efa24d, #e16397); /* Firefox 3.6 - 15 */
	background: linear-gradient(to right, #efa24d , #e16397); /* 标准的语法(必须放在最后) */
	border-radius: 10px;
    border-radius: 6px;
    color: #fff;
}
.el-radio-button:first-child .el-radio-button__inner{
	border-radius: 15px 0 0 15px;
}
.el-radio-button:last-child .el-radio-button__inner{
	border-radius:  0 15px 15px 0;
}
</style>
<body style="margin: 0;overflow-x: auto;">
    <div id="main" class="c-hide"  v-loading.fullscreen.lock="isloading">
        <header-tab appname="疾病筛查分析" isback="true" isrefresh="true"></header-tab>
        <div class="mt20 plr10">
			<div class="flex searchDiv">
                <div class="f_s_0">
                    <span class="c-f16 c-333 pr10">时&emsp;&emsp;间</span>
					<el-date-picker v-model="dateValue[0]" type="date" unlink-panels placeholder="开始日期" value-format="yyyy-MM-dd" @change="changeDate" :clearable="false" :picker-options="pickerOptions" >
					</el-date-picker>
					<span>—</span>
					<el-date-picker v-model="dateValue[1]" type="date" unlink-panels placeholder="结束日期" value-format="yyyy-MM-dd" @change="changeDate" :clearable="false" :picker-options="pickerOptions">
					</el-date-picker>
                </div>
                <div class="f_s_0 ml20">
                    <span class="c-f16 c-333 pr10">筛查名称</span>
                    <el-select v-model="valueName" placeholder="请选择" @change="seleName">
                        <el-option v-for="item in optionsName" :key="item.code" :label="item.title" :value="item.code">
                        </el-option>
                    </el-select>
				</div>
				<div class="f_s_0 ml20">
                    <span class="c-f16 c-333 pr10">预约类型</span>
                    <el-select v-model="valueType" placeholder="请选择" @change="seleType">
                        <el-option v-for="item in optionsType" :key="item.code" :label="item.name" :value="item.code" >
                        </el-option>
                    </el-select>
               </div>
           </div>            
	        <div class="flex">
	        	<div class="f_s_0" style="width:600px;">
	        		<div  class="mt15 c-border bgc-fff c-border-r-4">
		            	<div class="c-border-b plr10 ptb10 c-f16 c-333 c-position-r">高危/预警人群分析
		            		<div class="c-position-a" style="right: 15px;top: 5px;">
		            			<el-radio-group v-model="ptab" size="small" @change="changePie">
								    <el-radio-button label="132">按服务类型分布</el-radio-button>
								    <el-radio-button label="131">按性别分布</el-radio-button>
							    </el-radio-group>
		            		</div>
		            	</div>
		            	<div class="mtb40" style="min-width: 550px;">
		            		<div  v-show="ptab=='132'">
		            			<div class="pie-chart" id="pieChart132" style="height: 290px; width: 100%;"  v-show="pieShow132"></div>
		            			<div  v-show="!pieShow132" class="c-t-center pt10"  style="height: 290px; width: 100%;">
				            		<img src="../../../images/wushuju_img.png" alt="" style="width: 290px;"/>    
				            		<div class="pt5 c-f16 c-666">无数据</div>
				            	</div>
		            		</div>
		            		<div  v-show="ptab=='131'">
		            			<div class="pie-chart" id="pieChart131" style="height: 290px; width: 100%;" v-show="pieShow131"></div>
		            			<div  v-show="!pieShow131" class="c-t-center pt10"  style="height: 290px; width: 100%;">
				            		<img src="../../../images/wushuju_img.png" alt="" style="width: 290px;"/>    
				            		<div class="pt5 c-f16 c-666">无数据</div>
				            	</div>
		            		</div>
		            	</div>
	            	</div>
	        	</div>
	        	<div class="f_g_1">
		        	<div class="ui-grid ui-grid-middle mt15 mlr15 mb10 mainBlocktop">
		            	<div class="ui-col-0 plr15 c-position-r" style="width: 30%;height: 200px;border-right:1px solid #ffffff">
		            		<div class="c-f16 c-fff pt10">转诊率            			
							    <el-tooltip class="item" effect="dark" content="转诊率=疾病筛查预约总量/预警量" placement="right">
							      <img class="c-position-a" src="../../../images/wenhao.png" alt="" class="tip" style="top: 12px;left:70px;">
							    </el-tooltip>
		            		</div>
		            		<div class="c-fff c-f14 c-t-center" style="line-height: 150px;"> 
		            			<b class="c-f28">{{topData.reservationRate}}</b>
		            		</div>
		            	</div>
		            	<div class="ui-col-1">
		            		<div class="plr15" style="height: 100px;border-bottom:1px solid #ffffff">
		            			<div class="c-fff c-f16 pt10">
		            				疾病筛查转诊总量
		            			</div>
		                		<div class="c-fff c-f14 c-t-right mt30"> 
		                			<b class="c-f28">{{topData.reservationTotal}}</b>
		                		</div>
		            		</div>
		            		<div class="plr15" style="height: 100px;">
		            			<div class="c-f16 c-fff pt10">
		            				预警量
		            			</div>
		        				<div class="c-fff c-f14 c-t-right mt30">  
		                			<b class="c-f28">{{topData.warnTotal}}</b>
		                		</div>
		            		</div>
		            	</div>
		           	</div>
		        	<div class="ui-grid ui-grid-middle mt10 mlr15 mb10 mainBlockbottom">
		            	<div class="ui-col-0 plr15 c-position-r" style="width: 30%;height: 200px;border-right:1px solid #ffffff">
		            		<div class="c-f16 c-fff pt10">预警率            			
							    <el-tooltip class="item" effect="dark" content="预警率=预警量/总疾病筛查量" placement="right">
							      <img class="c-position-a" src="../../../images/wenhao.png" alt="" class="tip" style="top: 12px;left:70px;">
							    </el-tooltip>
		            		</div>
		            		<div class="c-fff c-f14 c-t-center" style="line-height: 150px;"> 
		            			<b class="c-f28">{{topData.warningRate}}</b>
		            		</div>
		            	</div>
		            	<div class="ui-col-1">
		            		<div class="plr15" style="height: 100px;border-bottom:1px solid #ffffff">
		            			<div class="c-fff c-f16 pt10">
		            				预警量
		            			</div>
		                		<div class="c-fff c-f14 c-t-right mt30"> 
		                			<b class="c-f28">{{topData.warnTotal}}</b>
		                		</div>
		            		</div>
		            		<div class="plr15" style="height: 100px;">
		            			<div class="c-f16 c-fff pt10">
		            				总筛查量
		            			</div>
		        				<div class="c-fff c-f14 c-t-right mt30">  
		                			<b class="c-f28">{{topData.surveyTotal}}</b>
		                		</div>
		            		</div>
		            	</div>
		           	</div>
	        	</div>
	        	<div class="f_s_0 pt5 pr5" style="width:600px;">
	            	<!-- 折线图 -->
        			<line-chart lineid="lineChart"></line-chart>
	        	</div>
	        </div>
	        <div  class="mtb10 c-border bgc-fff c-border-r-4">
            	<div class="c-border-b plr10 ptb10 c-f16 c-333 c-position-r">预约量分析</div>
            	<table-panel ref="tableRef" :tabledata="tableData" @getnewdata="getnewdata"></table-panel>
        	</div>
        </div>
        <!--模态框组件-->
        <vuedals></vuedals>
    </div>
    <script src="../../../js/vue.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../js/jquery-2.2.4.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../js/element-ui.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../plugins/toastr/toastr.min.js"></script>
    <script src="../../../js/es6-promise.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../js/underscore.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../js/util.js" type="text/javascript" charset="utf-8"></script>
    <!--<script src="../../../plugins/echarts/3.8.5/echarts.min.js" type="text/javascript" charset="utf-8"></script>-->
    <script src="../js/echarts.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../api/http-request.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../api/jbsc-api.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../api/statistics-api.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../component/common/event-bus.js"></script>
    <script src="../../../component/common/vuedals.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../component/statistics/header-tab.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../component/statistics/header-prompt.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../component/statistics/line-chart.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../component/statistics/table-panel.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../component/statistics/team-info.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../component/statistics/sign-progress-filter.js" type="text/javascript" charset="utf-8"></script>
    <script src="../js/common.js" type="text/javascript" charset="utf-8"></script>
    <script src="../js/jbsc-analysis.js" type="text/javascript" charset="utf-8"></script>
</body>
</html>

+ 5 - 0
app/statistics/html/smfw-analysis.html

@ -28,6 +28,11 @@
			<header-tab appname="上门服务" isback="true" isrefresh="true"></header-tab>
			<div class="mt20">
				<div class="c-border mlr20  c-border-r-4">
			        <div class="c-position-r ui-grid c-border-b pt15 pb10 plr30 c-cursor-p" @click="goPage('smfw-comprehensive-analysis.html')">
			        	<img src="../../../images/bingtu_icon.png" style="width: 30px;" class="ui-col-0"/>
			        	<div  class="ui-col-0 c-f16 c-333 pl20">总体分析</div>
			            <div class="c-arrow-r"></div>
			        </div>
			        <div class="c-position-r ui-grid c-border-b pt15 pb10 plr30 c-cursor-p" @click="goPage('qualifications-analysis.html')">
			        	<img src="../../../images/erweibiao_icon.png" style="width: 30px;" class="ui-col-0"/>
			        	<div  class="ui-col-0 c-f16 c-333 pl20">资质分析</div>

+ 156 - 0
app/statistics/html/smfw-comprehensive-analysis.html

@ -0,0 +1,156 @@
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>上门服务-总体分析</title>
    <meta name="author" content="yihu.com" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0"
    />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <link rel="stylesheet" type="text/css" href="../../../css/font-awesome.min.css" />
    <link rel="stylesheet" type="text/css" href="../../../css/style.min.css" />
    <link rel="stylesheet" type="text/css" href="../../../css/cross.css" />
    <link rel="stylesheet" type="text/css" href="../../../css/flex.css" />
    <link rel="stylesheet" type="text/css" href="../../../css/element-ui.css" />
    <link href="../../../plugins/toastr/toastr.min.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="../css/common.css" />
</head>
<style>
.mainBlocktop {
	width: 265px;
    height: 170px;
	background: -webkit-linear-gradient(left, #5a83ff , #3b6cfe); /* Safari 5.1 - 6.0 */
	background: -o-linear-gradient(right, #5a83ff, #3b6cfe); /* Opera 11.1 - 12.0 */
	background: -moz-linear-gradient(right, #5a83ff, #3b6cfe); /* Firefox 3.6 - 15 */
	background: linear-gradient(to right, #5a83ff , #3b6cfe); /* 标准的语法(必须放在最后) */
	border-radius: 6px;
    color: #fff;
    font-size: 16px;
}
.mainBlockbottom {
	width: 265px;
    height: 170px;
    font-size: 16px;
	background: -webkit-linear-gradient(left, #396cfe ,#1954fd); /* Safari 5.1 - 6.0 */
	background: -o-linear-gradient(right, #396cfe, #1954fd); /* Opera 11.1 - 12.0 */
	background: -moz-linear-gradient(right, #396cfe, #1954fd); /* Firefox 3.6 - 15 */
	background: linear-gradient(to right, #396cfe , #1954fd); /* 标准的语法(必须放在最后) */
    border-radius: 6px;
    color: #fff;
}
.el-radio-button:first-child .el-radio-button__inner{
	border-radius: 15px 0 0 15px;
}
.el-radio-button:last-child .el-radio-button__inner{
	border-radius:  0 15px 15px 0;
}
</style>
<body style="margin: 0;overflow-x: auto;">
    <div id="main" class="c-hide"  v-loading.fullscreen.lock="isloading">
        <header-tab appname="上门服务-总体分析" isback="true" isrefresh="true"></header-tab>
        <div class="mt20 plr10">
	        <div class="flex">
	        	<div class="f_g_1">
			        <div  class="mtb10 c-border bgc-fff c-border-r-4">
		            	<div class="c-border-b plr10 ptb10 c-f16 c-333 c-position-r">疾病分析</div>
		            	<div style="overflow:auto;height: 417px;">
		            		<table-panel ref="tableRef1" :tabledata="diagnosisList"  :hastopbar="true" :cantclick="true"></table-panel>
			            	<div v-if="!tableParams[0].noMore" class="c-border-l c-border-r c-border-b ptb8 mlr25 c-t-center mb40 c-f16" style="margin-top: -40px;cursor: pointer;" @click="loadTableData(0)">查看更多</div>
		            	</div>
		        	</div>
	        	</div>
	        	<div class="f_s_0 mlr15" style="width:540px;">
	        		<div class="mtb10">
	        			<span class="c-f16 c-333 pr10">时&emsp;&emsp;间</span>
	        			<el-date-picker  v-model="dateValue" type="month" value-format="yyyy-MM"  placeholder="选择月" :picker-options="pickerOptions" @change="changeDate"></el-date-picker>
	        		</div>
	            	<div class="ui-grid">
	            		<div class="ui-col-0 c-50 mr5 mainBlocktop">
	            			<div class="c-f16 pt20 pl25 c-position-r">服务评价均分            			
							    <el-tooltip class="item" effect="dark" content="服务评价均分=已完成工单总评分/已完成工单量" placement="right">
							      <img class="c-position-a" src="../../../images/wenhao.png" alt="" class="tip" style="top: 22px;left:130px;">
							    </el-tooltip>
		            		</div>
		            		<div class="c-t-center" style="line-height: 100px;"> 
		            			<span class="c-f28">{{topData.evaluateSplit}}</span>分
		            		</div>
	            		</div>
	            		<div class="ui-col-0 c-50 ml5 mainBlockbottom">
	            			<div class="c-f16  pt20  pl25">已服务居民 </div>
		            		<div class="c-t-center" style="line-height: 100px;"> 
		            			<span class="c-f28">{{topData.doorPatientServiceCount}}</span>人
		            		</div>
	            		</div>
	            	</div>
	            	<div  class="mt10 c-border bgc-fff c-border-r-4">
		            	<div class="c-border-b plr10 ptb10 c-f16 c-333">服务人群分析
		            	</div>
	            		<!-- 饼图-->
		            	<div class="pie-chart" id="pieChart" style="height: 187px; width: 100%;" v-show="pieShow"></div>
		            	<div  v-show="!pieShow" class="c-t-center pt10"  style="height: 187px; width: 100%;">
		            		<img src="../../../images/wushuju_img.png" alt="" style="width: 187px;"/>    
		            		<div class="pt5 c-f16 c-666">无数据</div>
		            	</div>
	            	</div>
	        	</div>
	        	<div class="f_g_1">
			        <div  class="mtb10 c-border bgc-fff c-border-r-4">
		            	<div class="c-border-b plr10 ptb10 c-f16 c-333 c-position-r">服务项目和药品分析
		            		<div class="c-position-a" style="right: 15px;top: 5px;">
		            			<el-radio-group v-model="ptab" size="small" @change="showTab">
								    <el-radio-button label="1">服务项目</el-radio-button>
								    <el-radio-button label="2">药品</el-radio-button>
							    </el-radio-group>
		            		</div>
		            	</div>
		            	<div  v-show="ptab=='1'" style="overflow:auto;height: 417px;" v-loading="tableParams[2].isloading">
			    			<table-panel ref="tableRef2"  :tabledata="itemList" :hastopbar="true" :cantclick="true"></table-panel>
			            	<div v-if="!tableParams[2].noMore" class="c-border-l c-border-r c-border-b ptb8 mlr25 c-t-center mb40 c-f16" style="margin-top: -40px;cursor: pointer;" @click="loadTableData(2)">查看更多</div>
		            	</div>
		            	<div  v-show="ptab=='2'" style="overflow:auto;height: 417px;" v-loading="tableParams[1].isloading">
			    			<table-panel ref="tableRef3"  :tabledata="drugList" :hastopbar="true" :cantclick="true"></table-panel>
			            	<div v-if="!tableParams[1].noMore" class="c-border-l c-border-r c-border-b ptb8 mlr25 c-t-center mb40 c-f16" style="margin-top: -40px;cursor: pointer;" @click="loadTableData(1)">查看更多</div>
		            	</div>
		        	</div>
	        	</div>
	        </div>
	        <div  class="mtb10 c-border bgc-fff c-border-r-4">
            	<div class="c-border-b plr10 ptb10 c-f16 c-333 c-position-r">预约量分析</div>
		    	<table-panel ref="tableRef0" :tabledata="tabledata0" @getnewdata="getnewdata"></table-panel>
        	</div>
        </div>
        <!--模态框组件-->
        <vuedals></vuedals>
    </div>
    <script src="../../../js/vue.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../js/jquery-2.2.4.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../js/element-ui.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../plugins/toastr/toastr.min.js"></script>
    <script src="../../../js/es6-promise.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../js/underscore.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../js/util.js" type="text/javascript" charset="utf-8"></script>
    <!--<script src="../../../plugins/echarts/3.8.5/echarts.min.js" type="text/javascript" charset="utf-8"></script>-->
    <script src="../js/echarts.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../api/http-request.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../api/jbsc-api.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../api/statistics-api.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../component/common/event-bus.js"></script>
    <script src="../../../component/common/vuedals.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../component/statistics/header-tab.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../component/statistics/header-prompt.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../component/statistics/line-chart.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../component/statistics/table-panel.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../component/statistics/team-info.js" type="text/javascript" charset="utf-8"></script>
    <script src="../../../component/statistics/sign-progress-filter.js" type="text/javascript" charset="utf-8"></script>
    <script src="../js/common.js" type="text/javascript" charset="utf-8"></script>
    <script src="../js/smfw-comprehensive-analysis.js" type="text/javascript" charset="utf-8"></script>
</body>
</html>

+ 95 - 1
app/statistics/js/common.js

@ -1,3 +1,6 @@
var indexName = {'index_128': '预约总量', 'index_129': '居民预约量', 'index_130': '代预约量'};
function getStartDate(chooseYear){
    // 按年度来计算的时候,开始时间是该年度7月1号还是到下一个年的6月30号结束
    if(chooseYear == 2016){
@ -74,6 +77,52 @@ function soreRank(arr){
    return temp;
}
/*
 * 绘制饼图数据处理  // elId, arry, title, hasNum,colors,radius,noLedend,param
 */
function handlePieData(arg){	
	var legend = {
        orient: 'vertical',
        right: '15%',
        y:'center',
   	};
   	var colorList=[]
    legendNames = [];
    var arr1 = _.map(arg.arry, function(o,i){
        var obj = {
            name: o.name,
            count: parseInt(o.amount||o[arg.param])
        };
        legendNames.push(obj);
        if(o.code){
        	colorList.push(arg.colors[o.code])
        }else{
        	colorList.push(arg.colors[i])
        }
        return {
            value: parseInt(o.amount||o[arg.param]),
            name: o.name
        }
    });
    legend.formatter = function(name){
        if(arg.hasNum){
	        var target;
	        for (var i = 0, l = legendNames.length; i < l; i++) {
	            if (legendNames[i].name == name) {
	                target = parseInt(legendNames[i].count);
	            }
	        }
        	return name+": "+target
        }else{
        	return name
        }        
    }
    if(arg.noLedend){   //true时无注释
    	drawPie(arg.elId, arr1, colorList, null, arg.position||['50%', '51%'], arg.radius||['70%', '90%'], arg.title)
    }else{
    	drawPie(arg.elId, arr1, colorList, legend, arg.position||['30%', '51%'], arg.radius||['70%', '90%'], arg.title)
    }
}
/*
 * 绘制饼图
@ -99,7 +148,7 @@ function drawPie(elId, arry, color, legend, center, radius, title){
                normal: {
                    show: false,
                    textStyle: {
                        color: "#000"
                        color: "#000",
                    }
                }
            },
@ -232,3 +281,48 @@ function drawBarChart(el, xData, yData, color, name){
    myChart.setOption(option);
    return myChart;
}
/**
 * 绘制折线图数据处理
 * @param {Object} elId  div的id值
 * @param {Object} data  数据值
 * @param {Object} selectedDateType  true的时候x轴值年-月-日 1-日,2-周, 3-月
 */
function getChartData(elId, data, selectedDateType,hasLegend,title,unit){
	var dataZoom_end,
        xDatas = [],
        yDatas = [],
        names = [],
        colors = ['#12b7f5', '#cd67fd','#FF9526'];
    for(var p in data){
    	if(hasLegend){
        	names.push(indexName[p]);
    	}
        var xData = _.map(data[p], function(o){
            return o.range;
        });
        var yData = _.map(data[p], function(o){
            return o.amount;
        });			        
        xDatas.push(xData);
        yDatas.push(yData);
        var lastIndex = yData.length % 10;
        if(yData.length >10 ){  
            dataZoom_end = 100-(9/yData.length)*100;  
        }else{  
            dataZoom_end = 0;  
        }
    }
	setTimeout(function(){    	
	    EventBus.$emit("draw-line-chart", {
	        panelName : title,
	        quotaNames : names,
	        xData : xDatas[0],
	        yDatas : yDatas,
	        colors : colors,
	        selectedDateType: selectedDateType,        
	        nowlineid : elId,
	        unit:unit
    	});
	},10)
    
}

+ 7 - 22
app/statistics/js/home.js

@ -60,29 +60,14 @@ new Vue({
			photo: '../../../images/shangmenfuwu_icon.png',
			label: '上门服务',
			url: 'smfw-analysis.html',
			allowArea:"350203",
			allowArea:"350200,350203",
		},
		 {
			photo: '../../../images/shaichafenxin_icon.png',
			label: '疾病筛查',
			url: 'jbsc-analysis.html',
			allowArea:"",
		},
//		{
//			photo: '../../../images/zigetongji_icon.png',
//			label: '资质分析',
//			url: 'qualifications-analysis.html',
//			allowArea:"350203",
//		}, {
//			photo: '../../../images/buzhufeiyong_icon.png',
//			label: '补助费用统计',
//			url: 'subsidy-cost.html',
//          allowArea:"350203",
//		}, {
//			photo: '../../../images/gongdanfenxi_icon.png',
//			label: '服务工单分析',
//			url: 'service-sheet-analysis.html',
//          allowArea:"350203",
//		}, {
//			photo: '../../../images/xiangyinfenxi_icon.png',
//			label: '响应速度分析',
//			url: 'response-speed-analysis.html',
//          allowArea:"350203",
//		}
		],
		signRateData: {
		    signTask: {

A diferenza do arquivo foi suprimida porque é demasiado grande
+ 372 - 0
app/statistics/js/jbsc-analysis.js


+ 372 - 0
app/statistics/js/smfw-comprehensive-analysis.js

@ -0,0 +1,372 @@
var reqList = [{}]; //记录请求的参数和url,用于后退时使用
var colors={"0":"#5b9db5","1":"#ed7d31","2":"#a5a5a5",
	"3":"#ffc000","4":"#44c274","5":"#70ad47",
	"6":"#255e91","7":"#9e480e","8":"#7e7e7e","9":"#997300","10":"#264478","11":"#43682b","12":"#5b9db5"}
Vue.use(Vuedals.default);
new Vue({
	el: "#main",
	data: {
        isloading:false,  //加载中
        start:"",
        end:"",
		dateValue: "",
		initDate:"",
		pickerOptions: {
			disabledDate: function(d) {
				return d > new Date();
			}
		},
		pieData:[],    //饼图数据
		tabnumber:0,
		diagnosisList:[],	 //疾病分析列表
		itemList:[],	 //服务项目列表
		drugList:[],	 //药品分析列表	
		tabledata0:[],   //表格数据	
		topData:{},
		//请求页面所需参数
		levelList:[{level:"4",areaLevel:"2"},{level:"3",areaLevel:"3"},{level:"2",areaLevel:"4"}],  //两种搜索,地区等级对比
		areaLevel:"",  // 2、市,3、区,4、社区,5、团队
		initareaLevel:"",
		initlevel: '',
		initarea: '',
		level: '',
		area: '',
		areaTitle: '',
		index: '121',
		lowLevel: '',
		initlowLevel:"",
		lowCode: '',
		chooseYear: '',
		userRole: '',
		ptab:"1",
		tableParams:[{isloading:false,noMore:false,page:1}, //疾病分析
		{isloading:false,noMore:false,page:1},//药品分析
		{isloading:false,noMore:false,page:1}],  //服务项分析
		pieShow:true,
		pageSize:100,
	},
	components: {
		vuedals: Vuedals.Component
	},
	mounted: function () {
		var vm=this
		//初始化数据
		initData(vm);
		vm.getData()
		vm.bindEvent()
	},
	methods: {
		getData:function(isNext,type){  //是否下转
			var vm = this
			var params={
				areaLevel: vm.areaLevel,
				level: vm.level,
				area: vm.area,
				endDate: vm.start,
				startDate: vm.end,
				lowLevel: vm.lowLevel
			}
			_.each(vm.tableParams,function(item,index){
				vm.tableParams[index].page=1   //重新搜索时,上边三个表格重新加载
			})
			loadData([0,1,2,3,4], vm); //刷新数据
			if(isNext){
				//存储请求所带的参数
				reqList.push(params);
			}else{
				reqList[reqList.length-1]=params
			}
		},
		//加载上边三个表格
		loadTableData:function(index){ 
			var vm = this
			vm.tableParams[index].isloading=true
			vm.tableParams[index].page++
			loadData([index], vm); //刷新数据
		},
		//表格tab切换/下转
		getnewdata:function(arg){
			var vm = this
			vm.lowLevel=arg.lowLevel||""
			if(arg.level){
				vm.level = arg.level
				vm.areaLevel = _.find(vm.levelList,{level:vm.level}).areaLevel
			}
			if(arg.area){
				vm.area = arg.area
			}
			if(arg.areaTitle){
				vm.areaTitle = arg.areaTitle
			}
			vm.getData(arg.level)   //有传level,说明是下转
		},
		//时间选择
		changeDate: function () {
			var vm=this
			if(vm.dateValue){				
				if(vm.initDate==vm.dateValue){
					vm.end = new Date().format("yyyy-MM-dd");
					var start= new Date();
					start.setDate(1)
					vm.start = start.format("yyyy-MM-dd")
				}else{
					var year=vm.dateValue.split("-")[0]
					var month=vm.dateValue.split("-")[1]
					vm.start=new Date(vm.dateValue).format("yyyy-MM-dd")
					vm.end=new Date(year,month,0).format("yyyy-MM-dd")
				}
				//搜索时,取消下转记录
				vm.area=vm.initarea
				vm.areaLevel=vm.initareaLevel
				vm.level=vm.initlevel
				vm.lowLevel = vm.initlowLevel
				reqList=[{}]; //搜索时清空历史记录,重新搜索
				vm.getData()
				vm.initTable()
			}
		},
		showTab:function(){
		},
		bindEvent:function(){
			var vm=this
			//监听后退按钮的操作
			EventBus.$on("back-click", function (arg) {
				EventBus.$emit('update-statistics-time', {}); //更新统计时间
				if (reqList.length == 1) {
					history.go(-1);
				} else {
					var preInfo = reqList.pop();
					var info = reqList[reqList.length - 1];
					vm.areaLevel = info.areaLevel;
					vm.level = info.level;
					vm.area = info.area;
					vm.lowLevel = info.lowLevel;
	
					vm.getData()
					
					vm.$refs.tableRef0.changeTab({level:vm.level,lowlevel:vm.lowLevel})   //表格tab
				}
			});
			//监听页面刷新
			EventBus.$on("refresh-click", function (arg) {
				EventBus.$emit('update-statistics-time', {}); //更新统计时间
				loadData([0, 1,2,3,4], vm);
			});
			$("#main").removeClass("c-hide");
		},
		initTable:function(){
			var vm=this
			vm.$refs.tableRef1.initTable({
				//表格表头
				headers:[{thead:"排名",param:"name",canclick:true},{thead:"工单量(个)",param:"orderCount"}],
			})
			vm.$refs.tableRef2.initTable({
				//表格表头
				headers:[{thead:"排名",param:"name",canclick:true},{thead:"使用人数(人)",param:"patientCount"},{thead:"工单量(个)",param:"orderCount"}],
			})
			vm.$refs.tableRef3.initTable({
				//表格表头
				headers:[{thead:"排名",param:"name",canclick:true},{thead:"使用人数(人)",param:"patientCount"},{thead:"工单量(个)",param:"orderCount"}],
			})
			vm.$refs.tableRef0.initTable({
    			tabList:[{name:"各区",level:"4",lowlevel:"3",isShow:true},{name:"社区",level:"3",lowlevel:"2",isShow:true},{name:"团队",level:"2",lowlevel:"1",isShow:true}],
				//表格表头
				headers:[{thead:"排名",param:"name",canclick:true},{thead:"合计工单(个)",param:"all"}],
				tabnumber:vm.tabnumber
			})
		},
    },
})
function initData(vm) {
	//获得缓存中缓存的角色权限
	var userRole = window.sessionStorage.getItem("selectedRole");
	if (!userRole) {
		return false;
	}
	vm.userRole = JSON.parse(userRole);
	//level:2、市,3、区,4、社区,5、团队
	vm.initareaLevel = vm.areaLevel = vm.userRole.code == '350200' ? 2 : vm.userRole.code.length == 6 ? 3 : 4;
	vm.initlevel = vm.level = vm.userRole.code == '350200' ? 4 : vm.userRole.code.length == 6 ? 3 : 2;
//	vm.lowLevel = vm.initlowLevel = vm.userRole.code == '350200' ? 3 : vm.userRole.code.length == 6 ? 2 : 1;
				
	vm.initarea =vm.area = vm.userRole.code;
	vm.areaTitle = vm.userRole.name;
	
	vm.tabnumber=vm.areaLevel==4?1:vm.areaLevel==3?2:3   //表格显示的tab数
	
	//初始化时间
	var now = new Date();
	vm.end = new Date().format("yyyy-MM-dd");
	var start= new Date();
	start.setDate(1)
	vm.start = start.format("yyyy-MM-dd")
	
	vm.initDate=vm.dateValue=now.format("yyyy-MM")
	
	vm.initTable()
}
function initReqParams(vm) {
	var reqParam = [{
		url: "doctor/statisticAnalyze/getDoorDiagnosisAnalysis",  //疾病列表
		reqType: 'get',
		data:{
			area: vm.area,
	    	level: vm.areaLevel,  //等级,2市 3区 4社区 5团队
	    	page: vm.tableParams[0].page,
	    	pageSize: vm.pageSize,
	    	endDate: vm.end
		},
	},{
		url: "doctor/statisticAnalyze/getDoorDrugCodeAnalysis",  //药品分析列表
		reqType: 'get',
		data:{
			area: vm.area,
	    	level: vm.areaLevel,  //等级,2市 3区 4社区 5团队
	    	page: vm.tableParams[1].page,
	    	pageSize: vm.pageSize,
	    	subjectClass: "010"
		},
	},{
		url: "doctor/statisticAnalyze/getDoorDrugCodeAnalysis",  //服务项列表
		reqType: 'get',
		data:{
			area: vm.area,
	    	level: vm.areaLevel,  //等级,2市 3区 4社区 5团队
	    	page: vm.tableParams[2].page,
	    	pageSize: vm.pageSize,
	    	subjectClass: "020"
		},
	},{
		url: "doctor/statisticAnalyze/doorAggregateAnalysis",   //头中部数据
		reqType: 'get',
		data:{
			startDate: vm.start,
			endDate: vm.end,
			area: vm.area,
		    level: vm.areaLevel, //2、市,3、区,4、社区,5、团队
		},
	},{
		url: "doctor/statisticAnalyze/order_lowlevel_all",  //工单列表--表格
		reqType: 'get',
		data:{
			startDate: vm.start,
			endDate: vm.end,
			area: vm.area,
		    level: vm.level, //2、市,3、区,4、社区,5、团队
		    sort: 1,
		    lowLevel:vm.lowLevel||"",  //等级 1:团队 2社区机构 3区级 4市级
		},
	},]
	return reqParam;
}
function loadData(loadArr, vm) {
	//获取其他请求的参数
	var reqParams = initReqParams(vm),
		reqPromise = [],
		newArr = []; //记录非顶部请求的请求数组
	for (i = 0; i < loadArr.length; i++) {
		var j = loadArr[i];
		var param = reqParams[j];
		reqPromise.push(httpRequest.get(param.url, {
			data: param.data
		}));
		newArr.push(loadArr[i]);
	}
	vm.isloading=true    
	if (reqPromise.length > 0) {
		Promise.all(reqPromise).then(function (ress) {
			var res1, res2, res3, res4, res5;
			for (var i = 0; i < loadArr.length; i++) {
				var j = loadArr[i] + 1;
				if (j == 1) { res1 = ress[i]; }
				if (j == 2) { res2 = ress[i]; }
				if (j == 3) { res3 = ress[i]; }
				if (j == 4) { res4 = ress[i]; }
				if (j == 5) { res5 = ress[i]; }
			}
			if (res4 && res4.status == 200) {
				vm.topData=res4.data
				var voucherList=_.map(vm.topData.voucherList,function(item,index){
					return {
						code:item.slaveKey1,
						amount:item.result1,
						name:item.slaveKey1Name,
					}
				})
				if(voucherList.length==0||(voucherList.length==1&&!voucherList.name)){
					vm.pieShow=false
				}else{
					vm.pieShow=true
				}
				setTimeout(function(){						
					//服务人群分析-饼图
					handlePieData({elId:"pieChart",arry: voucherList, title:{},colors: colors,param:"total",position:['30%', '51%']})
				},10)
			}
			if (res5 && res5.status == 200) {
				vm.tabledata0=listHandle(res5.data["index_121"],"all", vm);
			}
			if (res1 && res1.status == 200) {
				if(vm.tableParams[0].page==1){
					vm.diagnosisList=[]
				}
				vm.diagnosisList=listHandle(vm.diagnosisList.concat(res1.data),"orderCount",vm)
				vm.tableParams[0].isloading=false
				if(res1.data.length<vm.pageSize){
					vm.tableParams[0].noMore=true
				}else{
					vm.tableParams[0].noMore=false
				}
				vm.tableParams[0].isloading=false
			}
			if (res2 && res2.status == 200) {
				if(vm.tableParams[1].page==1){
					vm.drugList=[]
				}
				vm.drugList=listHandle(vm.drugList.concat(res2.data),"orderCount",vm)
				vm.tableParams[1].isloading=false
				if(res2.data.length< vm.pageSize){
					vm.tableParams[1].noMore=true
				}else{
					vm.tableParams[1].noMore=false
				}
				vm.tableParams[1].isloading=false
			}
			if (res3 && res3.status == 200) {
				if(vm.tableParams[2].page==1){
					vm.itemList=[]
				}
				vm.itemList=listHandle(vm.itemList.concat(res3.data),"orderCount",vm)
				vm.tableParams[2].isloading=false
				if(res3.data.length< vm.pageSize){
					vm.tableParams[2].noMore=true
				}else{
					vm.tableParams[2].noMore=false
				}
				vm.tableParams[0].isloading=false
			}
			vm.isloading=false
		})
	}
}
function listHandle(list,param, vm){
    var topArr = [];
    if(list.length==1&&!list[0].name){
    	list=[]
    }
    topArr = soreRank(getKeyValueArr(list, param||"amount"));
    var newlist = _.map(list, function(o, index){
    	o.rank=topArr[index]
    	return o
    });
    EventBus.$emit("render-area-data",{
    });
    return newlist
}

+ 225 - 0
app/statistics/js/specialData.js

@ -0,0 +1,225 @@
//服务质量分析-图表数据
var qualificationChartData = {
	"msg": "查询成功!",
	"data": {
		"index_3": [{
			"amount": 95,
			"range": "2019-07"
		}, {
			"amount": 98,
			"range": "2019-08"
		}, {
			"amount": 100,
			"range": "2019-09"
		}, {
			"amount": 97,
			"range": "2019-10"
		}, {
			"amount": 98,
			"range": "2019-11"
		}, {
			"amount": 98,
			"range": "2019-12"
		}]
	},
	"status": 200
}
//服务质量分析-表格数据
var qualificationTableData = {
	"msg": "查询成功",
	"data": {
		"index_3": [{
			"amount": "98.56",
			"name": "上门出诊基础服务包",
		}, {
			"amount": "98.55",
			"name": "婴幼儿护理服务包",
		}, {
			"amount": "97.00",
			"name": "老年人护理服务包",
		}, {
			"amount": "96.65",
			"name": "高血压康复服务包",
		}, {
			"amount": "95.23",
			"name": "糖尿病康复服务包",
		}]
	},
	"status": 200
}
//服务分析-表格
var qualificationTableData1 = {
	"msg": "查询成功",
	"data": {
		"index_3": [{
			"amount": "60",
			"name": "婴幼儿健康体检",
		}, {
			"amount": "50",
			"name": "落枕推拿治疗",
		}, {
			"amount": "50",
			"name": "内科疾病推拿治疗",
		}, {
			"amount": "40",
			"name": "小儿斜颈推拿治疗",
		}, {
			"amount": "30",
			"name": "网球肘推拿治疗",
		}]
	},
	"status": 200
}
//患者分析
var areaData = {
	"msg": "查询成功",
	"data": {
		"index_3": [{
			"amount": "15",
			"code": "350203",
			"name": "思明区",
		}, {
			"amount": "20",
			"code": "350206",
			"name": "湖里区",
		},{
			"amount": "12",
			"code": "350205",
			"name": "海沧区",
		}, {
			"amount": "8",
			"code": "350212",
			"name": "同安区",
		}, {
			"amount": "5",
			"code": "350211",
			"name": "集美区",
		},{
			"amount": "127",
			"code": "111",
			"name": "健康筛查",
		}, {
			"amount": "116",
			"code": "222",
			"name": "住院",
		}, {
			"amount": "99",
			"code": "333",
			"name": "康复期",
		}, {
			"amount": "85",
			"code": "444",
			"name": "日常健康",
		},{
			"amount": "127",
			"code": "555",
			"name": "预警居民",
		}, {
			"amount": "6",
			"code": "666",
			"name": "未预警居民",
		},{
			"amount": "1270",
			"code": "777",
			"name": "男",
		}, {
			"amount": "960",
			"code": "888",
			"name": "女",
		}, {
			"amount": "660",
			"code": "999",
			"name": "未知",
		}]
	},
	"status": 200
}
//健康分析
var healthData = {
	"msg": "查询成功",
	"data": {
		"index_3": [{
			"amount": "127",
			"code": "111",
			"name": "健康筛查",
		}, {
			"amount": "116",
			"code": "222",
			"name": "住院",
		}, {
			"amount": "99",
			"code": "333",
			"name": "康复期",
		}, {
			"amount": "85",
			"code": "444",
			"name": "日常健康",
		}]
	},
	"status": 200
}
//预警分布
var warnData = {
	"msg": "查询成功",
	"data": {
		"index_3": [{
			"amount": "127",
			"code": "555",
			"name": "预警居民",
		}, {
			"amount": "6",
			"code": "666",
			"name": "未预警居民",
		}]
	},
	"status": 200
}
//性别分布
var sexData = {
	"msg": "查询成功",
	"data": {
		"index_3": [{
			"amount": "1270",
			"code": "777",
			"name": "男",
		}, {
			"amount": "960",
			"code": "888",
			"name": "女",
		}, {
			"amount": "660",
			"code": "999",
			"name": "未知",
		}]
	},
	"status": 200
}
//年龄分布
var ageData = {
	"msg": "查询成功",
	"data": {
		"index_3": [{
			"amount": "270",
			"range": "0-6",
		}, {
			"amount": "1060",
			"range": "7-18",
		}, {
			"amount": "460",
			"range": "19-30",
		}, {
			"amount": "1660",
			"range": "31-50",
		}, {
			"amount": "700",
			"range": "51-64",
		}, {
			"amount": "560",
			"range": "65岁以上",
		}]
	},
	"status": 200
}

+ 19 - 8
component/statistics/line-chart.js

@ -3,18 +3,18 @@
        endDate,
        chooseYear;
    Vue.component('line-chart',{
        template: '<div class="mtb10 bgc-fff c-border pb10">\
            <div class="ui-grid ui-grid-middle plr10 c-border-b">\
                <div class="ui-col-0">\
        template: '<div class="mtb10 bgc-fff c-border pb10 c-position-r">\
            <div class="ui-grid plr10 c-border-b">\
                <div class="ui-col-0 ptb10">\
                    <span class="c-333 c-f16">{{panelName}}</span>\
                </div>\
                <div class="ui-col-1 c-t-right ptb5">\
                <div class="ui-col-1 c-t-right ptb5" v-show="!noDateType">\
                    <span class="date-tag" :class="{active: selectedDateType == 1}" data-type="1" @click="changeType(1)">日</span><!--\
                    --><span class="date-tag" :class="{active: selectedDateType == 2}" data-type="2" @click="changeType(2)">周</span><!--\
                    --><span class="date-tag" :class="{active: selectedDateType == 3}" data-type="3" @click="changeType(3)">月</span>\
                </div>\
            </div>\
            <div class="ui-grid ui-grid-middle mt5 plr10">\
            <div class="ui-grid ui-grid-middle mt5 plr10" v-if="!noshowDate">\
                <div v-if="showDatePanel" class="ui-col-1" >\
                    <span>数据时间:</span>\
                    <el-date-picker\
@ -40,9 +40,10 @@
                    </el-date-picker>\
                </div>\
                <div v-if="!showDatePanel" class="ui-col-1 c-f12 c-909090"><span>{{startDate}}</span> ~ <span>{{endDate}}</span>数据</div>\
                <div class="ui-col-0 c-f12 c-909090">单位:{{unit}}</div>\
                <div class="ui-col-0 c-f12 c-909090 pr15">单位:{{unit}}</div>\
            </div>\
            <div class="line-chart" :id="lineid" style="height: 200px; width: 100%;"></div>\
            <div v-else class="c-f12 c-909090 mtb10 pl15">单位:{{unit}}</div>\
            <div class="line-chart" :id="lineid" style="width: 100%;" :style="{ height: chartheight + \'px\' }"></div>\
        </div>',
        props:['lineid', 'showDatePanel'],
        data: function(){
@ -62,6 +63,9 @@
                    }
                },
                chooseYear:"",
                noDateType:false,   //不显示年月日
                chartheight:200,   //表格高度
                noshowDate:false,   //显示统计时间
            }
        },
        methods: {
@ -95,7 +99,14 @@
	                vm.dateValue = arg.dateValue;
//	                vm.chooseYear = arg.chooseYear;
	                chooseYear = arg.chooseYear;
	                drawLine(vm, arg);
	                vm.noDateType=arg.noDateType;
	                vm.noshowDate=arg.noshowDate;
	                if(arg.chartheight){
	                	vm.chartheight=arg.chartheight
	                }
					vm.$nextTick(function(){
	                	drawLine(vm, arg);
					})
            	}
            })
            

+ 130 - 0
component/statistics/table-panel.js

@ -0,0 +1,130 @@
(function(){
    Vue.component('table-panel',{
        template: '<div class="table-panel">\
    		<div class="flex table-tab-pane" v-if="!hastopbar">\
    			<div class="f_g_1 table-tab-item" v-for="(item,index) in tabList" :key="index" @click="tabClick(index)" v-if="item.isShow">\
    				<div class="plr20" :class="{\'active\':tabActive==index}"><span>{{item.name}}</span></div>\
    			</div>\
    		</div>\
    		<div class="ptb20 plr25">\
    			<table class="table-content table-bordered table-striped mb20" id="listTable">\
	                <thead><tr>\
	                    <th v-for="(th,i) in headers" :key="i" :class="i>=2?\'c-t-right\':\'\'">{{th.thead}}\
	                    	<el-tooltip class="item" effect="dark" :content="th.tip" placement="top" v-if="th.tip">\
						      <img class="c-position-a tip" src="../../../images/icon_wenhao2.png" alt="" style="top: 13px;left:70px;">\
						    </el-tooltip>\
	                    </th>\
	                </tr></thead>\
	                <tbody>\
	                    <tr v-if="tabledata.length>0" v-for="(row,index) in tabledata" :key="index" class="data-row">\
	                        <td v-for="(th,i) in headers" :key="i" :class="i>=1?\'c-t-right\':\'\'" @click="getLowLevelData(row,th)">\
		                        <div v-if="i==0&&row.rank" style="display: inline-table;" class="ranking" :class="{\'ranking1\': row.rank==1, \'ranking2\': row.rank==2, \'ranking3\': row.rank==3}">{{row.rank}}</div>\
		                        {{row[th.param]}}\
	                        </td>\
	                    </tr>\
	                    <tr v-if="tabledata.length==0">\
	                        <td :colspan="headers.length" class="c-t-center">无数据</td>\
	                    </tr>\
	                </tbody>\
	            </table>\
    		</div>\
        </div>',
        props:["index","tabledata","cantclick","hastopbar"],
        data: function(){
            return {
            	tabList:[{name:"各区",level:"4",lowlevel:"",isShow:true},{name:"社区",level:"3",lowlevel:"2",isShow:true},{name:"团队",level:"2",lowlevel:"1",isShow:true}],
            	tabActive:0,
            	headers:[{thead:"排名",param:"name"},{thead:"名称",param:"name",tip:""},{thead:"",param:"address",tip:""}],
			}
        },
        mounted: function(){
        	var vm=this
            EventBus.$on("render-table-data", function(arg){
            	
            })
        },
        methods: {
        	initTable:function(arg){
	            var vm = this;
	            if(arg.tabList&&arg.tabList.length>0){
	            	vm.tabList=arg.tabList
	            }
	            if(arg.headers&&arg.headers.length>0){
	            	vm.headers=arg.headers
	            }
            	var showIndex=vm.tabList.length-arg.tabnumber||0  //小于这个值的tab隐藏
    			_.each(vm.tabList,function(item,index){  
    				if(index<showIndex){
    					item.isShow=false
    				}else{
    					item.isShow=true
    				}
    			})
				vm.tabActive=showIndex
        	},
        	tabClick:function(index){
            	var vm = this;
            	if(vm.tabActive != index){
	        		vm.tabActive = index
	        		//触发组件监听事件,去父页面请求新的数据
	                this.$emit("getnewdata", {
		                lowLevel: vm.tabList[index].lowlevel
	                });
            	}
        	},
            getLowLevelData: function(row,th){
            	var vm=this
            	if(th.canclick){  //点击名称有效
	            	if(vm.tabActive == vm.tabList.length-1){  
	            		if(vm.tabList[vm.tabActive].name=="团队"){ //tab在最后一级,显示团队信息
			                var title="团队信息"
		                	var size="md"
		                	var component='team-info'
		                	if(vm.index==27){
		                		title="团队信息和代预约记录"
		                		size="lg"
		                		component='team-info-dyy'
		                	}
		                    //弹框显示团队信息
		                    Vuedals.Bus.$emit('new', {
		                        title: title,
		                        component: component,
		                        props: {
		                            teamId: row.code,
		                            year: vm.year
		                        },
		                        size:size
		                    });
	            		}
	            	}else{
	            		vm.changeTab()
	            		//触发组件监听事件,去父页面请求新的数据
	                    this.$emit("getnewdata", {
	                        level: vm.tabList[vm.tabActive].level,
	                        area: row.code,
	                        areaTitle: row.name,
	                    });
	            	}
            	}
            },
            changeTab:function(arg){
            	var vm=this
            	var showIndex=0
            	if(arg){  //回退
	            	vm.tabActive--
	            	showIndex = _.findIndex(vm.tabList,{level:arg.level.toString()})
            	}else{   //下转
        			vm.tabActive++
            		showIndex = vm.tabActive
            	}
        		_.each(vm.tabList,function(item,index){
    				if(index<showIndex){
    					item.isShow=false
    				}else{
    					item.isShow=true
    				}
    			})
           }
        }
    });
})()

BIN=BIN
images/bingtu_icon.png


BIN=BIN
images/shaichafenxin_icon.png