Home Explore Help
Register Sign In
raolu
/
PC-application
Watch 0
Star 0
Fork 1
Files Issues 0 Pull Requests 0 Wiki
Browse Source

统计页面中维度过滤功能实现

raolu 7 years ago
parent
525eac2f80
commit
c99c54f92f
16 changed files with 658 additions and 20 deletions
Split View Show Diff Stats
  1. 5 0
      api/statistics-api.js
  2. 1 0
      app/statistics/comprehensive-analysis.html
  3. 1 0
      app/statistics/consulting-analysis.html
  4. 1 1
      app/statistics/css/common.css
  5. 61 6
      app/statistics/estimate-analysis.html
  6. 1 1
      app/statistics/home.html
  7. 50 3
      app/statistics/js/comprehensive-analysis.js
  8. 21 1
      app/statistics/js/consulting-analysis.js
  9. 302 0
      app/statistics/js/estimate-analysis.js
  10. 1 1
      app/statistics/js/home.js
  11. 61 4
      app/statistics/js/prescription-analysis.js
  12. 1 0
      app/statistics/prescription-analysis.html
  13. 6 3
      component/statistics/bar-chart.js
  14. 3 0
      component/statistics/line-chart.js
  15. 85 0
      component/statistics/prescription-filter.js
  16. 58 0
      component/statistics/year-filter.js

+ 5 - 0
api/statistics-api.js
View File 

@ -53,6 +53,11 @@
 
        //长处方分析接口
 
        getPrescriptionTotalHistogram: function(data){
 
            return httpRequest.get("statistics/getPrescriptionTotalHistogram", {data: data})
 
        },
 
        //评价分析
 
        //按月份获得个月的评价平均分
 
        getAVGSocreByMonth: function(data){
 
            return httpRequest.get("/statistics/getAVGSocreByMonth", {data: data});
 
        }
 
    }

+ 1 - 0
app/statistics/comprehensive-analysis.html
View File 

@ -118,6 +118,7 @@
 
        <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/year-filter.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/area-data-panel.js" type="text/javascript" charset="utf-8"></script>
 
        <script src="../../component/statistics/team-info.js" type="text/javascript" charset="utf-8"></script>

+ 1 - 0
app/statistics/consulting-analysis.html
View File 

@ -68,6 +68,7 @@
 
        <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/year-filter.js" type="text/javascript" charset="utf-8"></script>
 
        <script src="../../component/statistics/area-data-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="js/common.js" type="text/javascript" charset="utf-8"></script>

+ 1 - 1
app/statistics/css/common.css
View File 

@ -604,7 +604,7 @@ ul {
 
	font-size: 12px;
 
	line-height: 24px;
 
	/*background: #EEEEEE;*/
 
	border: 1px solid #eee;
 
	border: 1px solid #e1e1e1;
 
	border-radius: 5px;
 
	white-space: nowrap;
 
	overflow: hidden;

+ 61 - 6
app/statistics/estimate-analysis.html
View File 

@ -1,9 +1,64 @@
 
<!DOCTYPE html>
 
<html>
 
	<head>
 
		<meta charset="UTF-8">
 
		<title>评价分析</title>
 
	</head>
 
	<body>
 
	</body>
 
    <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/common.css"/>
 
        <style>
 
            .tag{
 
                width: 40%;
 
                margin: 0 auto;
 
                border: 1px solid #e1e1e1;
 
                padding: 15px 0;
 
                border-radius: 8px;
 
            }
 
        </style>
 
    </head>
 
    <body>
 
        <div id="main">
 
            <header-tab :appname="appname" :isback="true" :isrefresh="true" :isfilter="false" :isopen="true" ></header-tab>
 
            <header-prompt></header-prompt>
 
            <div class="c-t-center mt20">
 
                <div class="tag">
 
                    <div class="c-f16 c-bold c-333">{{avg}}</div>
 
                    <div class="c-f14 c-666 mt5">平均评分</div>
 
                </div>
 
            </div>
 
            <div class="mt20 c-border">
 
                <div class="plr10 ptb10 c-border-b">
 
                    <span class="c-f14 c-333 ml5">平均评分</span>
 
                </div>
 
                <div id="lineChart" style="height: 200px; width: 100%;"></div>
 
            </div>
 
            <!-- 底部区域图 -->
 
            <area-data-panel class="mt20" v-on:getnewdata="getAreaData"></area-data-panel>
 
            <!--模态框组件-->
 
            <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/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="../../api/http-request.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/area-data-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="js/common.js" type="text/javascript" charset="utf-8"></script>
 
        <script src="js/estimate-analysis.js" type="text/javascript" charset="utf-8"></script>
 
    </body>
 
</html>

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

@ -8,7 +8,7 @@
 
        <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="../../fonts/font-awesome/css/font-awesome.min.css"/>
 
        <link rel="stylesheet" type="text/css" href="../../css/font-awesome.min.css"/>
 
        <link rel="stylesheet" type="text/css" href="../../css/bootstrap.min.css"/>
 
        <link rel="stylesheet" type="text/css" href="../../css/style.min.css"/>
 
        <link rel="stylesheet" type="text/css" href="../../css/cross.css"/>

+ 50 - 3
app/statistics/js/comprehensive-analysis.js
View File 

@ -80,7 +80,8 @@ new Vue({
 
                index: this.index,
 
                endDate: this.endDate,
 
                startDate: this.startDate,
 
                lowLevel: this.lowLevel
 
                lowLevel: this.lowLevel,
 
                selectedDateType: this.selectedDateType
 
            })
 
        }
 
    },
 
@ -99,7 +100,8 @@ new Vue({
 
            index: this.index,
 
            endDate: this.endDate,
 
            startDate: this.startDate,
 
            lowLevel: this.lowLevel
 
            lowLevel: this.lowLevel,
 
            selectedDateType: this.selectedDateType
 
        });
 
        
        //设置监听器， 监听折线图日期变化
 
@ -125,6 +127,49 @@ new Vue({
 
        EventBus.$on("refresh-click", function(arg){
 
            loadData([0,1,2], vm);
 
        });
 
        //弹出筛选框
 
        EventBus.$on('filter-click', function(arg) {
 
            //弹框显示筛选条件
 
            Vuedals.Bus.$emit('new', {
 
                title: '条件筛选',
 
                onClose:function(data){
 
                    vm.chooseYear = data.chooseYear;
 
                    vm.startDate = getStartDate(vm.chooseYear);
 
                    vm.endDate = getEndDate(vm.chooseYear);
 
                    
                    //请求参数重置，页面类型重新开始
 
                    vm.level = vm.userRole.code == '350200' ? 4 : vm.userRole.code.length == 6 ? 3 : 2;
 
                    vm.area = vm.userRole.code;
 
                    vm.areaTitle = vm.userRole.name;
 
                    EventBus.$emit('update-area-name', {areaName: vm.areaTitle});
 
                    vm.selectedDateType = 1;
 
                    
                    //然后清空请求列表数组
 
                    reqList.splice(0, reqList.length);
 
                    
                    loadData([0, 1, 2], vm);//刷新数据
 
                    
                    //存储请求所带的参数
 
                    reqList.push({
 
                        level: vm.level,
 
                        area: vm.area,
 
                        areaTitle: vm.areaTitle,
 
                        index: vm.index,
 
                        endDate: vm.endDate,
 
                        startDate: vm.startDate,
 
                        lowLevel: vm.lowLevel,
 
                        selectedDateType: vm.selectedDateType
 
                    });
 
                    
                    EventBus.$emit('update-statistics-year', {selectDate: vm.chooseYear + "年"});//更新年份
 
                    EventBus.$emit('update-statistics-time', {});//更新统计时间
 
                },
 
                component: 'year-filter',
 
                props: {
 
                    selectedYear: vm.chooseYear
 
                }
 
            });
 
        });
 
    }
 
})
 
@ -149,6 +194,7 @@ function initData(vm){
 
    
    vm.startDate = getStartDate(vm.chooseYear);
 
    vm.endDate = getEndDate(vm.chooseYear);
 
    EventBus.$emit('update-statistics-year', {selectDate: vm.chooseYear + "年"});
 
}
 
function initReqParams(vm){
 
@ -357,7 +403,8 @@ function handleSecondPanelData(data, vm){
 
        quotaNames : names,
 
        xData : xDatas[0],
 
        yDatas : yDatas,
 
        colors : colors
 
        colors : colors,
 
        selectedDateType: vm.selectedDateType
 
    });
 
}

+ 21 - 1
app/statistics/js/consulting-analysis.js
View File 

@ -89,6 +89,26 @@ new Vue({
 
        EventBus.$on("refresh-click", function(arg){
 
            loadData([0,1,2], vm);
 
        });
 
        //弹出筛选框
 
        EventBus.$on('filter-click', function(arg) {
 
            //弹框显示筛选条件
 
            Vuedals.Bus.$emit('new', {
 
                title: '条件筛选',
 
                onClose:function(data){
 
                    console.log(data);
 
                    vm.chooseYear = data.chooseYear;
 
                    vm.endDate = getEndDate(vm.chooseYear);
 
                    
                    loadData([0, 1, 2], vm);//刷新数据
 
                    EventBus.$emit('update-statistics-year', {selectDate: vm.chooseYear + "年"});//更新年份
 
                    EventBus.$emit('update-statistics-time', {});//更新统计时间
 
                },
 
                component: 'year-filter',
 
                props: {
 
                    selectedYear: vm.chooseYear
 
                }
 
            });
 
        });
 
    }
 
});
 
@ -111,6 +131,7 @@ function initData(vm){
 
        vm.chooseYear = now.getFullYear() - 1;
 
    }
 
    vm.endDate = getEndDate(vm.chooseYear);
 
    EventBus.$emit('update-statistics-year', {selectDate: vm.chooseYear + "年"});
 
}
 
function initReqParams(vm){
 
@ -183,7 +204,6 @@ function loadData(loadArr, vm){
 
function handleTopPanelData(data, vm){
 
    var obj = data.result[0];
 
    console.log(obj);
 
    vm.topDatas = {
 
        total: obj.total,
 
        noRelyCount: obj.noRelyCount,

+ 302 - 0
app/statistics/js/estimate-analysis.js
View File 

@ -0,0 +1,302 @@
 
var reqList = [];
 
new Vue({
 
    el: "#main",
 
    data: {
 
        appname: "评价分析",
 
         //页面请求参数
 
        index: 28,
 
        level: '',
 
        area: '',
 
        startDate: '',
 
        endDate: '',
 
        avg: 0
 
    },
 
    components: {
 
        vuedals: Vuedals.Component
 
    },
 
    methods: {
 
        getAreaData: function(arg){
 
            //如果level改变，则需要重新加载整个页面的数据，否则只需加载底部区域数据
 
            if(arg.level == this.level){
 
                this.lowLevel = arg.lowLevel;
 
                loadData([2], this);
 
            }else{
 
                this.level = arg.level;
 
                this.lowLevel = arg.lowLevel;
 
                this.area = arg.area;
 
                this.areaTitle = arg.areaTitle;
 
                loadData([0,1,2], this);
 
            }
 
            EventBus.$emit('update-area-name', {areaName: this.areaTitle});
 
            //存储请求所带的参数
 
            reqList.push({
 
                level: this.level,
 
                area: this.area,
 
                areaTitle: this.areaTitle,
 
                lowLevel: this.lowLevel,
 
                endDate: this.endDate
 
            })
 
        }
 
    },
 
    mounted: function(){
 
        //初始化数据
 
        initData(this);
 
        
        //获得顶部各tab的值
 
        loadData([0,1,2], this); //参数组数表示请求的区域为上中下
 
        
        //存储请求所带的参数
 
        reqList.push({
 
            level: this.level,
 
            area: this.area,
 
            areaTitle: this.areaTitle,
 
            index: this.index,
 
            endDate: this.endDate,
 
            startDate: this.startDate,
 
            lowLevel: this.lowLevel
 
        });
 
        
        //设置监听器， 监听折线图日期变化
 
        var vm = this;
 
        //监听后退按钮的操作
 
        EventBus.$on("back-click", function(arg){
 
            if(reqList.length == 1){
 
                history.go(-1);
 
            } 
            else{
 
                var preInfo = reqList.pop();
 
                var info = reqList[reqList.length - 1];
 
                vm.level = info.level;
 
                vm.area = info.area;
 
                vm.areaTitle = info.areaTitle;
 
                vm.lowLevel = info.lowLevel;
 
                vm.index = info.index;
 
                
                loadData([0,1,2], vm);
 
            }
 
        });
 
        //监听页面刷新
 
        EventBus.$on("refresh-click", function(arg){
 
            loadData([0,1,2], vm);
 
        });
 
    }
 
});
 
function initData(vm){
 
    //获得缓存中缓存的角色权限
 
    var userRole = window.localStorage.getItem("selectedRole");
 
    if(!userRole){
 
        return false;
 
    }
 
    vm.userRole = JSON.parse(userRole);
 
    vm.level = vm.userRole.code == '350200' ? 4 : vm.userRole.code.length == 6 ? 3 : 2;
 
    vm.area = vm.userRole.code;
 
    vm.areaTitle = vm.userRole.name;
 
    EventBus.$emit('update-area-name', {areaName: vm.areaTitle});
 
    
    var now = new Date();
 
   
    vm.endDate = now.format("yyyy-M-dd");
 
    vm.startDate = "2017-01-01"; //评价功能是2017年才上线的
 
}
 
function initReqParams(vm){
 
    var param = [{
 
        url: "/statistics/getAVGSocre",
 
        data: {level: vm.level, area: vm.area}
 
    },{
 
        url: "/statistics/getAVGSocreByMonth",
 
        data: {level: vm.level, area: vm.area, statDate: vm.startDate, endDate: vm.endDate}
 
    },{
 
        url: "/statistics/lowlevel_all",
 
        data: {level: vm.level, area: vm.area, index: vm.index, sort: 1, date: vm.endDate, lowlevel: vm.lowLevel}
 
    }];
 
    
    return param;
 
}
 
function loadData(loadArr, vm){
 
    //获取其他请求的参数
 
    var reqParams = initReqParams(vm),
 
        reqPromise = [],
 
        sendPanelReq = [];
 
    
    for(i=0; i< loadArr.length; i++){
 
        var j = loadArr[i];
 
        var param = reqParams[j];
 
        if(j == 1){
 
            sendPanelReq.push(param);
 
        }else{
 
            reqPromise.push(httpRequest.get(param.url, {data: param.data}));
 
        }
 
    }
 
    
    if(sendPanelReq.length > 0){
 
        statisticAPI.getAVGSocreByMonth(sendPanelReq[0].data).then(function(res){
 
            if(res.status == 200){
 
                handleSecondPanelData(res.data, vm);
 
            }else{
 
                console.log(res.msg);
 
            }
 
        });
 
    }
 
    if(reqPromise.length > 0){
 
        Promise.all(reqPromise).then(function(ress){
 
            var res1, res2, res2;
 
            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(res1){
 
                if(res1.status == 200){
 
                    vm.avg = res1.data.rs.avgCount;
 
                }else{
 
                    console.log(res1.msg);
 
                }
 
            }
 
//          if(res2){
 
//              if(res2.status == 200){
 
//                  handleSecondPanelData(res2.data, vm);
 
//              }else{
 
//                 console.log(res2.msg);
 
//              }
 
//              
//          }
 
            if(res2){
 
                if(res2.status == 200){
 
                    listHandle(res2.data, vm);
 
                }else{
 
                    console.log(res2.msg);
 
                }
 
            }
 
        })
 
    }
 
}
 
function handleSecondPanelData(data, vm){
 
    var xData = [],
 
        yData = [];
 
    for(i=0; i<data.length; i++){
 
        var item = data[i];
 
        xData.push(item.month);
 
        yData.push(item.socre);
 
    }
 
    drawLine(xData, yData, '平均评分', '#12b7f5');
 
}
 
function listHandle(data, vm){
 
    for(i in data){
 
        var data2 = JSON.parse(data[i]);
 
        var list = data2.data;
 
        var topArr = soreRank(getKeyValueArr(list, 'avgCount'));
 
        var arr = _.map(list, function(o, index){
 
            var cols = [o.name, o.avgCount];
 
            return {
 
                rank: topArr[index],
 
                code: o.code,
 
                name: o.name,
 
                cols: cols
 
            }
 
        });
 
        
        EventBus.$emit("render-area-data",{
 
            level: vm.level,
 
            area: vm.area,
 
            lowLevel: vm.lowLevel,
 
            headers: ["排名", "平均评分"],
 
            rows: arr
 
        });
 
    }
 
}
 
function drawLine(xData, yData, name, color){
 
    var lineCharts = echarts.init(document.getElementById('lineChart'));
 
    
    //处理数据, 数据按照10条数一屏展示
 
    var lastIndex = xData.length % 10;
 
    if(xData.length >10 ){  
        dataZoom_end = 100-(9/xData.length)*100;  
    }else{  
        dataZoom_end = 0;
 
    }
 
    
    var options = {
 
        tooltip: {
 
            trigger: 'axis'
 
        },
 
        legend: {
 
            top: '0px',
 
            data: [name],
 
            borderColor: "#f1f1f1"
 
        },
 
        grid: {
 
            show: false,
 
            left: '20px',
 
            right: '20px',
 
            bottom: '40px',
 
            top: '20px',
 
            containLabel: true
 
        },
 
        xAxis: {
 
            type: 'category',
 
            boundaryGap: false,
 
            data: xData,
 
            axisLabel: {
 
                interval:0,//横轴信息全部显示  
                formatter: function (value, index) {
 
                    return value+"月";
 
                }
 
            }
 
        },
 
        yAxis: {
 
            type: 'value',
 
            axisPointer: {
 
                snap: true
 
            },
 
            scale: true,
 
            minInterval: 1,
 
            boundaryGap: ['10%', '30%'],
 
            splitLine: {show:false}
 
        },
 
        dataZoom: [{//给x轴设置滚动条  
            start: dataZoom_end,
 
            end: 100,
 
            type: 'slider',
 
            zoomLock: true,
 
        },{ //下面这个属性是内容区域配置
 
            start: dataZoom_end,
 
            end: 100,
 
            type: 'inside',
 
            zoomLock: true,
 
        }],
 
        series: [{
 
            name: name,
 
            type: 'line',
 
            smooth: true,
 
            data: yData,
 
//          color: color,
 
            lineStyle:{
 
                normal:{
 
                    color: color
 
                }
 
            },
 
            itemStyle: {
 
                normal: {
 
                    color: color
 
                }
 
            }
 
        }]
 
    };
 
    
    $("#lineChart").removeAttr('_echarts_instance_')
 
    lineCharts.setOption(options);
 
}

+ 1 - 1
app/statistics/js/home.js
View File 

@ -57,7 +57,7 @@ new Vue({
 
		}, {
 
			photo: '../../images/pijianfenxi_icon.png',
 
			label: '评价分析',
 
			url: 'resident-analysis.html'
 
			url: 'estimate-analysis.html'
 
		}, {
 
			photo: '../../images/changcufangfenxi_icon.png',
 
			label: '长处方分析',

+ 61 - 4
app/statistics/js/prescription-analysis.js
View File 

@ -18,8 +18,10 @@ new Vue({
 
        startDate: "",
 
        endDate: "",
 
        tagCode: 1, //顶部各个tag标签对应的值
 
        sumType: 4, //记录从筛选页面选择的统计维度 1-订单统计，2-费用统计，3-配送统计，4-年龄统计
 
        sumType: 1, //记录从筛选页面选择的统计维度 1-订单统计，2-费用统计，3-配送统计，4-年龄统计
 
        sumTypeName: "订单统计",
 
        disease: "", //疾病类型
 
        diseaseName: "全部",
 
        orderTagDatas: {
 
            total: 0,
 
            finishCount: 0,
 
@ -65,7 +67,8 @@ new Vue({
 
            lowLevel: this.lowLevel,
 
            tagCode: this.tagCode,
 
            sumType: this.sumType,
 
            disease: this.disease
 
            disease: this.disease,
 
            dateType: this.dateType
 
        });
 
        
        //设置监听器， 监听折线图日期变化
 
@ -85,6 +88,7 @@ new Vue({
 
                vm.tagCode = info.tagCode;
 
                vm.sumType = info.sumType;
 
                vm.disease = info.disease;
 
                vm.dateType = info.dateType;
 
                
                loadData([0,1,2], vm);
 
            }
 
@ -93,6 +97,53 @@ new Vue({
 
        EventBus.$on("refresh-click", function(arg){
 
            loadData([0,1,2], vm);
 
        });
 
        //弹出筛选框
 
        EventBus.$on('filter-click', function(arg) {
 
            //弹框显示筛选条件
 
            Vuedals.Bus.$emit('new', {
 
                title: '条件筛选',
 
                onClose:function(data){
 
                    vm.sumType = data.sumType;
 
                    vm.sumTypeName = data.sumTypeName;
 
                    vm.disease = data.disease;
 
                    vm.diseaseName = data.diseaseName;
 
                    
                    //将参数职位初始值
 
                    vm.level = vm.userRole.code == '350200' ? 4 : vm.userRole.code.length == 6 ? 3 : 2;
 
                    vm.lowLevel = vm.level - 1;
 
                    vm.area = vm.userRole.code;
 
                    vm.areaTitle = vm.userRole.name;
 
                    vm.dateType = 1;
 
                    EventBus.$emit('update-area-name', {areaName: vm.areaTitle});
 
                    
                    //然后清空请求列表数组
 
                    reqList.splice(0, reqList.length);
 
                    
                    loadData([0, 1, 2], vm);//刷新数据
 
                    //存储请求所带的参数
 
                    reqList.push({
 
                        level: vm.level,
 
                        area: vm.area,
 
                        areaTitle: vm.areaTitle,
 
                        endDate: vm.endDate,
 
                        startDate: vm.startDate,
 
                        lowLevel: vm.lowLevel,
 
                        tagCode: vm.tagCode,
 
                        sumType: vm.sumType,
 
                        disease: vm.disease,
 
                        dateType: vm.dateType
 
                    });
 
                    EventBus.$emit('update-statistics-year',{selectDate: vm.sumTypeName} );//显示统计维度的名称
 
                    EventBus.$emit('update-dimension-name', {dimensionVal: vm.diseaseName});//显示疾病类型的名称
 
                    EventBus.$emit('update-statistics-time', {});//更新统计时间
 
                },
 
                component: 'prescription-filter',
 
                props: {
 
                    sumType: vm.sumType,
 
                    disease: vm.disease
 
                }
 
            });
 
        });
 
    },
 
    methods: {
 
        changeTagCode: function(val){
 
@ -114,6 +165,7 @@ new Vue({
 
                tagCode: this.tagCode,
 
                sumType: this.sumType,
 
                disease: this.disease,
 
                dateType: this.dateType
 
            })
 
        },
 
        getBarData: function(arg){
 
@ -169,6 +221,9 @@ function initData(vm){
 
    
    var now = new Date();
 
    vm.endDate = now.format("yyyy-MM-dd");
 
    
    EventBus.$emit('update-statistics-year',{selectDate: vm.sumTypeName} );//显示统计维度的名称
 
    EventBus.$emit('update-dimension-name', {dimensionVal: vm.diseaseName});//显示疾病类型的名称
 
}
 
function initReqParams(vm){
 
@ -351,7 +406,8 @@ function handleSecondPanelData(data, vm){
 
                yData: seriesData,
 
                quotaName: names[vm.tagCode - 1],
 
                color: color,
 
                unit: "笔"
 
                unit: "笔",
 
                selectedDateType: vm.dateType
 
            });
 
            break;
 
        case 2:
 
@ -372,7 +428,8 @@ function handleSecondPanelData(data, vm){
 
                xData : xData,
 
                yDatas : yDatas,
 
                colors : colors,
 
                unit: "元"
 
                unit: "元",
 
                selectedDateType: vm.dateType
 
            });
 
            break;
 
        case 4:

+ 1 - 0
app/statistics/prescription-analysis.html
View File 

@ -146,6 +146,7 @@
 
        <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/prescription-filter.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/bar-chart.js" type="text/javascript" charset="utf-8"></script>
 
        <script src="../../component/statistics/area-data-panel.js" type="text/javascript" charset="utf-8"></script>

+ 6 - 3
component/statistics/bar-chart.js
View File 

@ -6,9 +6,9 @@
 
                    <span class="c-333 c-bold c-f14">{{panelName}}</span>\
 
                </div>\
 
                <div class="ui-col-1 c-t-right ptb5">\
 
                    <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>\
 
                    <span class="date-tag" :class="{active: selectedDateType == 1}" @click="changeType(1)">日</span><!--\
 
                    --><span class="date-tag" :class="{active: selectedDateType == 2}" @click="changeType(2)">周</span><!--\
 
                    --><span class="date-tag" :class="{active: selectedDateType == 3}" @click="changeType(3)">月</span>\
 
                </div>\
 
            </div>\
 
            <div class="clearfix mt5 plr10">\
 
@ -38,6 +38,9 @@
 
            var vm = this;
 
            EventBus.$on("draw-bar-chart", function(arg){
 
                vm.panelName = arg.panelName;
 
                if(arg.selectedDateType){
 
                    vm.selectedDateType = arg.selectedDateType;
 
                }
 
                if(arg.unit){
 
                    vm.unit = arg.unit;
 
                }

+ 3 - 0
component/statistics/line-chart.js
View File 

@ -38,6 +38,9 @@
 
            var vm = this;
 
            EventBus.$on("draw-line-chart", function(arg){
 
                vm.panelName = arg.panelName;
 
                if(arg.selectedDateType){
 
                    vm.selectedDateType = arg.selectedDateType;
 
                }
 
                if(arg.unit){
 
                    vm.unit = arg.unit;
 
                }

+ 85 - 0
component/statistics/prescription-filter.js
View File 

@ -0,0 +1,85 @@
 
(function(){
 
    Vue.component('prescription-filter', {
 
        template: '<div style="height: 400px;overflow: auto;">\
 
            <div class="mt10 ml10 filter-title">统计维度</div>\
 
            <div class="c-row mt10 plr20">\
 
                <div v-for="type in types" class="c-33 mt10" :class="{\'active\': sumType==type.value}" @click="selectType(type.value)"><a>{{type.name}}</a></div>\
 
            </div>\
 
            <div class="mt10 ml10 filter-title">慢病类型</div>\
 
            <div class="c-row mt20 plr20">\
 
                <div v-for="dis in diseases" class="c-33 mt10" :class="{\'active\': disease==dis.code}" @click="selectDisease(dis.code)"><a>{{dis.name}}</a></div>\
 
            </div>\
 
            <div id="footer">\
 
                <div class="c-row btn-wrap c-border-top fr">\
 
                    <div class="div-foot-btn mr20" @click="resetClick">\
 
                        <a href="#" class="c-666 f-fs16">重置</a>\
 
                    </div>\
 
                    <div class="div-foot-btn active" @click="confirmClick">\
 
                        <a href="#" class="c-666 f-fs16">确定</a>\
 
                    </div>\
 
                </div>\
 
            </div>\
 
        </div>',
 
        props:['sumType', 'disease'],
 
        data: function(){
 
            return {
 
                types: [{
 
                    value: 1,
 
                    name: "订单统计"
 
                },{
 
                    value: 2,
 
                    name: "费用统计"
 
                },{
 
                    value: 3,
 
                    name: "配送统计"
 
                },{
 
                    value: 4,
 
                    name: "年龄统计"
 
                }],
 
                diseases: [{
 
                    code: "",
 
                    name: "全部"
 
                },{
 
                    code: "HP0093",
 
                    name: "高血压"
 
                },{
 
                    code: "HP0047",
 
                    name: "糖尿病"
 
                }]
 
            }
 
        },
 
        methods: {
 
            selectType: function(val){
 
                this.sumType = val;
 
            },
 
            selectDisease: function(val){
 
                this.disease = val;
 
            },
 
            resetClick:function(){
 
                this.sumType = this.types[0].value;
 
                this.disease = this.diseases[0].code;
 
            },
 
            confirmClick:function(){
 
                //触发刷新
 
                var vm = this;
 
                var type = _.findWhere(vm.types, {value: vm.sumType}),
 
                    dis = _.findWhere(vm.diseases, {code: vm.disease});
 
                Vuedals.Bus.$emit('close', {
 
                    sumType: vm.sumType,
 
                    sumTypeName: type.name,
 
                    disease: vm.disease,
 
                    diseaseName: dis.name
 
                });
 
            }
 
        },
 
        mounted: function(){
 
            //如果前一个页面返回的选中的年份
 
            if(!this.sumType){
 
                this.sumType = this.types[0].value;
 
            }
 
            if(!this.disease){
 
                this.disease = this.diseases[0].code;
 
            }
 
        }
 
    })
 
})()

+ 58 - 0
component/statistics/year-filter.js
View File 

@ -0,0 +1,58 @@
 
(function(){
 
    Vue.component('year-filter', {
 
        template: '<div style="height: 400px;overflow: auto;">\
 
            <div class="mt10 ml10 filter-title">统计年份</div>\
 
            <div class="c-row mt20 ml40">\
 
                <div v-for="year in years" class="c-33" :class="{\'active\': year==selectedYear}" @click="chooseYear(year)"><a>{{year}}</a></div>\
 
            </div>\
 
            <div id="footer">\
 
                <div class="c-row btn-wrap c-border-top fr">\
 
                    <div class="div-foot-btn mr20" @click="resetClick">\
 
                        <a href="#" class="c-666 f-fs16">重置</a>\
 
                    </div>\
 
                    <div class="div-foot-btn active" @click="confirmClick">\
 
                        <a href="#" class="c-666 f-fs16">确定</a>\
 
                    </div>\
 
                </div>\
 
            </div>\
 
        </div>',
 
        props:['selectedYear'],
 
        data: function(){
 
            return {
 
                years: []
 
            }
 
        },
 
        methods: {
 
            chooseYear:function(year){
 
                this.selectedYear = year;
 
            },
 
            resetClick:function(){
 
                this.selectedYear = this.years[0];
 
            },
 
            confirmClick:function(){
 
                //触发刷新
 
                var vm = this;
 
                Vuedals.Bus.$emit('close', {
 
                    chooseYear: vm.selectedYear,
 
                });
 
            }
 
        },
 
        mounted: function(){
 
            //显示年份最低是2016年
 
            var now = new Date(),
 
                year = now.getFullYear();
 
            
            if(now.getMonth() >= 6){
 
                this.years.push(year);
 
            }
 
            for(i=year-1; i>=2016; i--){
 
                this.years.push(i);
 
            }
 
            
            //如果前一个页面返回的选中的年份
 
            if(!this.selectedYear){
 
                this.selectedYear = this.years[i];
 
            }
 
        }
 
    })
 
})()