raolu
/
PC-application


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115
							<!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/common.css"/>
    </head>
    <body>
        <div id="main">
            <area-data-panel v-on:getnewdata="getAreaData" :headers="headers" :rows="rows"></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="../../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/team-info.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="js/common.js" type="text/javascript" charset="utf-8"></script>
        <script type="text/javascript">
            (function(){
                Vue.use(Vuedals.default);
                new Vue({
                    el: "#main",
                    data: {
                        headers: [],
                        rows: [],
                        level: 4,
                        lowLevel: '',
                        index: '3,22',
                        area: '350200',
                        sort: 1,
                        year: 2017,
                        endDate: '2018-03-12',
                        reqUrl: 'statistics/lowlevel_total_mesh'
                    },
                    components: {
                        vuedals: Vuedals.Component
                    },
                    methods: {
                        changeLevel: function(arg){
                            var level = arg.level;
                            if(this.level > 2 && this.lowLevel != 1){
                                console.log("next");
                                //跳转去下一级数据
                                this.level = level --;
                            }
                        },
                        changeLowlevel: function(arg){
                            //点击tab时，获取下一级的数据
                            this.lowLevel = arg.lowLevel;
                        },
                        getAreaData: function(arg){
                            this.level = arg.level;
                            this.lowLevel = arg.lowLevel;
                            this.area = arg.area;
                            getAreaData(this);
                        }
                    },
                    mounted: function(){
                        var vm = this;
                        getAreaData(vm);
                    }
                })
                
                function getAreaData(vm){
                    var params = {
                        index: vm.index,
                        level: vm.level,
                        area: vm.area,
                        sort: vm.sort,
                        year: vm.year,
                        endDate: vm.endDate,
                        lowLevel: vm.lowLevel
                    };
                    statisticAPI.lowlevelData(vm.reqUrl, params).then(function(res){
                        if(res.status == 200){
                            for(i in res.data){
                                var list = res.data[i];
                                var topArr = soreRank(getKeyValueArr(list, 'amount'));
                                var arr = _.map(list, function(o, index){
                                    var amount = o.amount.split(","); // 咨询量, 未回复咨询量
                                    return {
                                        rank: topArr[index],
                                        code: o.code,
                                        name: o.name,
                                        cols: [o.name, amount[0], amount[1]]
                                    }
                                });
                                vm.headers = ["排名", "咨询量", "未回复"];
                                vm.rows = arr;
                            }
                        }else{
                            console.log(res.msg);
                        }
                    })
                }
            })()
        </script>
    </body>
</html>