caimei365-www/src/main/resources/static/js/supplier-center/dashboard.js

jqMultipleShow("click", ".navList", ".tab", ".con");
var isPC = ($(window).width()>768);
var dashboard = new Vue({
    el:'#dashboard',
    data:{
        isRequset:true,
        userId:'',
        homeData:'',
        formData:new FormData(),
        goodImage:'',
        shopinfo:{},
        promotions:{},
        rankingList:[],
        titleSshow:false,
        msgFlag:false,
        isShow:false,
        orderNumData:[],//统计订单金额
        paytotalfeeData:[]//统计订单数量
    },
     methods: {
         dashboardDataInfo:function(){
             var _this = this;
             SupplierApi.homePageData({userId:_this.userId},function (res) {
                 if(res.code==0){
                     _this.isRequset = false;
                     _this.homeData = res.data;
                     _this.goodImage = _this.homeData.user.image;
                     _this.shopinfo = res.data.shop;
                     _this.promotions = res.data.promotions;
                     _this.rankingList = res.data.salesRankingList;
                     if (res.data.unReadMessageCount>99){
                         res.data.unReadMessageCount = '99+';
                         _this.msgFlag = true
                     }else if(res.data.unReadMessageCount == 0){
                         _this.msgFlag = false
                     }else {
                         _this.msgFlag = true
                     }
                     _this.homeData.salesStatisticsList.map(function (item) {
                         _this.orderNumData.push(item.orderQuantity);
                         _this.paytotalfeeData.push(item.orderAmount);
                     });
                     _this.EchartsCreated2d();
                 }else {
                     _this.isRequset = true;
                 }
             })
         },
         uploadGoodsImagesFn:function (event) {//更换头像
              var _this = this;
                var inputDOM = _this.$refs.goodImage;
                var file = inputDOM.files;
                _this.formData.append('file', file[0]);
                SupplierApi.uploadimg(_this.formData,function(response){
                   _this.goodImage=response.data;
                    event.target.value = '';
                    SupplierApi.uploadAvatar({userId:_this.userId, image:_this.goodImage},function (res) {
                        console.log(res)
                    })
                });
         },
         toggleThisLadder: function(event){
                var el = event.currentTarget;
                if($(el).hasClass("on")){
                    $(el).removeClass("on").siblings('.mFixed').hide();
                    if(!isPC){looseBody();}
                }else{
                    $(el).addClass("on").siblings('.mFixed').show();
                    if(!isPC){fixedBody();}
                }
         },
         hideThisLadder: function(event){
                var el = event.currentTarget;
                $(el).parents('.priceTag').find('.tag').removeClass("on").siblings('.mFixed').hide();
                if(!isPC){looseBody();}
         },
         opentitle:function () {
             var _this = this;
             _this.titleSshow =!this.titleSshow;
         },
         perfect:function () {
            window.location.href='/supplier/setting/information.html';
         },
         EchartsCreated2d:function(){
             // 基于准备好的dom，初始化echarts实例
             var _this = this;
             var myChart = echarts.init(document.getElementById('StatisticsEacths'));
             var option = {
                     tooltip: {
                         trigger: 'axis',
                         axisPointer: {
                             type: 'cross',
                             label: {
                                 backgroundColor: '#6a7985'
                             }
                         }
                     },
                     legend: {
                         show: true,
                         top: 0,
                         right: '5%'
                     },
                     grid: {
                         left: '3%',
                         right: '4%',
                         bottom: '3%',
                         containLabel: true
                     },
                     xAxis: [{
                         type: 'category',
                         boundaryGap: false,
                         data: ['近一个月','近三个月','近半年','近一年'],
                         axisPointer: {
                             type: 'shadow'
                         }
                     }],
                     yAxis: [
                         {
                             type: 'value',
                             name: '',
                             axisTick: {
                                 show: true
                             }
                        },
                         {
                             type: 'value',
                             name: '',
                             axisTick: {
                                 show: true
                             }
                         }
                     ],
                     series: [
                         {
                             name: '订单金额(元)',
                             type: 'line',
                             smooth: true,
                             symbolSize: 3,
                             showSymbol: false,
                             symbol: 'emptyCircle',
                             lineStyle: { color: '#1667e1'  },
                             itemStyle: { color: '#1667e1', borderWidth: 3 },
                             areaStyle: {
                                     color: {
                                         type: 'linear',
                                         x: 0,
                                         y: 0,
                                         x2: 0,
                                         y2: 1,
                                         colorStops: [
                                            {offset: 0, color: 'rgba(65, 125, 230, 0.2)'},// 0% 处的颜色
                                            {offset: 1, color: 'rgba(65, 125, 230, 0)' }// 100% 处的颜色
                                         ]
                                     }
                             },
                             data: _this.paytotalfeeData,
                             animationDuration: 2000
                         },
                         {
                             name: '订单量(笔)',
                             type: 'line',
                             smooth: true,
                             symbolSize: 3,
                             showSymbol: false,
                             symbol: 'emptyCircle',
                             lineStyle: { color: '#16e175' },
                             itemStyle: { color: '#16e175', borderWidth: 3 },
                             areaStyle: {
                                     color: {
                                         type: 'linear',
                                         x: 0,
                                         y: 0,
                                         x2: 0,
                                         y2: 1,
                                         colorStops: [
                                             { offset: 0, color: 'rgba(131, 242, 183, 0.2)' },// 0% 处的颜色
                                             { offset: 1, color: 'rgba(131, 242, 183, 0)'}// 100% 处的颜色
                                         ]
                                     }
                             },
                             data: _this.orderNumData,
                             animationDuration: 2000
                         }

                     ]
             };
             // 使用刚指定的配置项和数据显示图表。
             myChart.setOption(option);
             window.onresize = myChart.resize;//移动适配
         }
    },
    mounted:function () {
        var _this = this;
        if(globalUserData) {
            _this.userId = globalUserData.userId;
            this.dashboardDataInfo();
        };
    }
})