carInsightSystem_wxapp/pages/index/Salesranking/Salesranking.js

// pages/index/Salesranking/Salesranking.js
const app = getApp()
import brokenLine from "../../../components/option/singleLineOption"
import histogram  from "../../../components/option/columnarOption"
import {times} from "../../../components/option/text"
import moment from "moment"
let iPageIndex = 1 // 当前第几页,0代表第一页 
let iPageSize =20 //每页显示多少数据
Page({
    data: {
        active: 0,
        end:moment().format("YYYY-MM"),
        showChart:true,
        // select: false,
        grade_value1: "",
        grade_name1: '按级别',
        grade_name2: '按价格',
        grade_name3: '按能源',
        grade_name4: '列表展示',
        grades4: ['列表展示', '图表展示'],
        Stats1:1,
        Stats2:2,
        Stats3:3,
        Stats4:4,
        num:0,
        num1:false,
        //弹出框
        show: false,
        duration: 300,
        position: 'bottom',
        // round: true,
        overlay: true,
        showChart: true,
        //图表
        // positiveOption:brokenLine(dName,dValue,dColor,data),
        imageUrl: getApp().globalData.imageUrl,
        date:wx.getStorageSync('newTime'),
        accountIndex:0,
        ranking:[],
        accountIndex:0,
        sSpec: '',
        sPriceType: '',
        sEnergyType: '',
        imageUrl: getApp().globalData.imageUrl,
        mockData:[],

      //
      ec: {
        lazyLoad:true  // 设置图表懒加载
      }
    },
    //  标签切换点击事件
    onChange(val) {
        let n = val.detail.index;
          this.setData({
            active: n
        })
        // wx.showToast({
        // //   title: `切换到标签 ${event.detail.name}`,
        //   icon: 'none',
        // });
      },
      getData() {
        wx.showToast({
            title: '加载中',
            icon: 'loading',
            duration: 3000
        })
        // 下拉列表
        this.getAmount();
        // 车型
        this.getTrend();
        // 品牌
        app.globalData.request({
            action: 'getUserBrand',
            token: 't%2BrswgjvzGM=',
            }).then(res => {
                let arr = []
                for (let i = 65; i <= 90; i++) {
                    arr.push({
                        name: String.fromCharCode(i),
                        data: []
                    });
                }
                for(let i of res){
                    for(let j of arr){
                        if(i.firstword == j.name){
                            j.data.push(i)
                        }
                    }
                }
                this.setData({
                    mockData:arr
                })
                setTimeout(() => {
                    wx.hideToast();
                }, 2000)
    }
            )
        setTimeout(() => {
            wx.hideToast();
        },500) 
       },
    //    排行榜数据
    getTrend(){  
        wx.showToast({
            title: '加载中',
            icon: 'loading',
            duration: 300000
        }) 
        let  obj = {
            action: 'getCheZhuCarSeriesRankingHome',
            sType:'Marketing',
            sStartTime: this.data.date,
            sEndTime: this.data.date,
            iPageIndex: iPageIndex,
            iPageSize: iPageSize,
            sSpec: this.data.sSpec,
            sPriceType: this.data.sPriceType,
            sEnergyType: this.data.sEnergyType
        }
        //第一次加载数据
        if (iPageIndex == 1) {
            this.setData({
                loadMore: true, //把"上拉加载"的变量设为true，显示  
                loadAll: false //把“没有数据”设为false，隐藏  
            })
        }
        app.globalData.request(obj,(database)=>{
        }).then(res => {
            const carName=[]
            const carValue=[]
            // console.log("这是数据",res)
            if (res && res.length > 0) {
                iPageIndex++;
                //把新请求到的数据添加到列表里  
               let list = this.data.ranking.concat(res);
            list.forEach(e=>{
                carName.push(e.seriesname)
                carValue.push(e.salescount)
            })
            //  length=(carName.length/carName.length)*100
            // console.log(carName.length)
                this.setData({
                    ranking: list, //获取数据数组    
                    loadMore: false,//把"上拉加载"的变量设为false，显示  
                    brandOption:histogram(carName,carValue,'#0084FF',false,(20/list.length)*100)
                });
                if (res.length < iPageSize) {
                    this.setData({
                        loadMore: false, //隐藏加载中。。
                        loadAll: true //所有数据都加载完了
                    });
                }
            } else {
                this.setData({
                    loadAll: true, //把“没有数据”设为true，显示  
                    loadMore: false //把"上拉加载"的变量设为false，隐藏  

                });
            }
            setTimeout(() => {
                wx.hideToast();
            }, 500)
        })
    },
          //页面上拉触底事件的处理函数
 onReachBottom:function() {
    // console.log("上拉触底事件")
    // console.log(iPageIndex)
    let that = this
    if (!that.data.loadMore) {
        that.setData({
            loadMore: true, //加载中  
            loadAll: false //是否加载完所有数据
        });
        //加载更多，这里做下延时加载
         that.getTrend();
    }
},
    // 筛选列表
    getAmount() {
        //能源
        app.globalData.request({
            action: 'getEnergy',
        }).then(res => {
            let arr = [{name:"全部能源",value:""}]
            res.forEach(ele => {
                let obj = {
                    name: ele.value,
                    value: ele.key
                }
                arr.push(obj)
            })
            this.setData({
                grades3: arr,
            })
        })
        //价格
        app.globalData.request({
            action: 'getPrice',
        }).then(res => {
            let arr = [{name:"全部价格",value:""}]
            res.forEach(ele => {
                let obj = {
                    name: ele.value,
                    value: ele.key
                }
                arr.push(obj)
            })
            this.setData({
                grades2: arr
            })
        })
        //级别
        app.globalData.request({
            action: 'getSpec',
        }).then(res => {
            // const data = res;
            let arr = [{text:"全部级别",value:""}]
            res.forEach(ele => {
                let obj = {
                    text: ele.value,
                    value: ele.key
                }
                arr.push(obj)
            })
            this.setData({
                grades1: arr,
            })
        })
    },
    bindValue(e) {
        let type = e.detail.type
        if (type == 0) {
            this.data.roomLevel = e.detail.val
        } else {
            this.data.builds = e.detail.val
        }
    },
    getBox(num){
        switch(num){
            case 1:
            return "top-noselected";
            case 2:
            return "top-selected";
            case 3:
            return "top-selecteds" 
        }
    },
    getFont(num){
        switch(num){
            case 1:
            return "notitle";
            case 2:
            return "title";
            case 3:
            return "titles" 
        }
    },
    //点击下拉
    bindShowMsg(e) {
        var id = e.currentTarget.id
        if (id == 1) {
            this.data.Stats1=3
            this.setData({
                select1: !this.data.select1,
                select2: false,
                select3: false,
                select4: false,
                box1:this.getBox(this.data.Stats1),
                font1:this.getFont(this.data.Stats1)
            })
        } else if (id == 2) {
            this.data.Stats2=3
            this.setData({
                select2: !this.data.select2,
                select1: false,
                select3: false,
                select4: false,
                box2:this.getBox(this.data.Stats2),
                font2:this.getFont(this.data.Stats2)
            })
        } else if (id == 3) {
            this.data.Stats3=3
            this.setData({
                select3: !this.data.select3,
                select2: false,
                select1: false,
                select4: false,
                box3:this.getBox(this.data.Stats3),
                font3:this.getFont(this.data.Stats3)
            })
        } else if (id == 4) {
            this.data.Stats4=3
            this.setData({
                select4: !this.data.select4,
                select1: false,
                select3: false,
                select2: false,
                box4:this.getBox(this.data.Stats4),
                font4:this.getFont(this.data.Stats4)
            })
        }
    },
    // 按级别
    mySelect1(e) {
        iPageIndex=1
        iPageSize = 20
        this.setData({
            ranking:[],
            sSpec: e.detail,
        })
        this.getTrend()
    },
    // 按价格
    mySelect2(e) {
        var name = e.currentTarget.dataset.name.name
        var value = e.currentTarget.dataset.name.value
        iPageIndex=1
        iPageSize = 20
        this.data.Stats2=3
        this.setData({
            ranking:[],
            grade_name2: name,
            select2: false,
            sPriceType: value,
            box2:this.getBox(this.data.Stats2),
            font2:this.getFont(this.data.Stats2)
        })
        this.getTrend()
    },
    // 按能源
    mySelect3(e) {
        var name = e.currentTarget.dataset.name.name
        var value = e.currentTarget.dataset.name.value
        iPageIndex=1
        iPageSize = 20
        this.data.Stats3=3
        this.setData({
            ranking:[],
            grade_name3: name,
            select3: false,
            sEnergyType: value,
            box3:this.getBox(this.data.Stats3),
            font3:this.getFont(this.data.Stats3)
        })
        this.getTrend()
    },
    // 列表展示
    mySelect4(e) {
        var name = e.currentTarget.dataset.name
        this.data.Stats4=3
        iPageIndex=1
        iPageSize = 20
        this.setData({
            ranking:[],
            grade_name4: name,
            select4: false,
            a: name != "列表展示",
            box4:this.getBox(this.data.Stats4),
            font4:this.getFont(this.data.Stats4)
        })
    },
    // 全部
    all(){
        iPageIndex=1
        iPageSize = 20
        this.data.num++
        let dj=this.data.num%2==0
       this.setData({
        grade_name1: '全部级别',
        grade_name2: '全部价格',
        grade_name3: '全部能源',
        sSpec: '',
        sPriceType: '',
        sEnergyType: '',
       boxSize:dj?'noall':'all1'
       })
       this.getTrend()
    },
     //全部品牌
     Allbrands(){
        wx.navigateTo({
            url: '/pages/index/Salesranking/Allbrands/Allbrands',
          })

    },
    //单个品牌
    Brands(e){
        var name=e.currentTarget.dataset.brand
        // console.log(name)
        wx.navigateTo({
        url: '/pages/index/Brandsales/Brandsales?carName='+name,
      })
        },
    bindDateChange: function(e) {
        this.data.num1=true
        iPageIndex=1
        iPageSize = 20
        this.setData({
            date:  e.detail.value,
            ranking:[],
            boxSize1:!this.data.num1?'noall':'all1'
          })
          this.getTrend()
    },
    priceSel(e) {
        this.setData({
            intervalSel: e.currentTarget.dataset.index
        })
    },
      //弹出框

      popup(e) {
        let duration = this.data.duration
        let models = e.currentTarget.dataset.car
        app.globalData.request({
            action:"getCheZhuCarSeriesListHome",
            sType:"Marketing",
            sSeriesName:models,
            sStartTime:times(this.data.date),
            sEndTime: this.data.date,
        }).then(res => {
                // console.log(res)
                const  dataTime=[]
                const  dataCar=[]
                res.forEach(e => {
                    if((e.sourcetime).substring(5,6)=="0"){
                        dataTime.push((e.sourcetime).substring((e.sourcetime).length-1,(e.sourcetime).length)+'月')
                    }else{
                        dataTime.push((e.sourcetime).substring((e.sourcetime).length-2,(e.sourcetime).length)+"月")
                    }
                    dataCar.push(e.salescount)
                });
            //    console.log(dataCar,dataTime)
            //     console.log(models)
            this.setData({
                show: true,
                duration,
                positiveOption: brokenLine(dataCar, dataTime),
                models
            })
        })
    },
    exit() {
        this.setData({
            show: false
        })
    },
    /**
     * 生命周期函数--监听页面加载
     */
    onLoad(options) {
    },

    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady() {

    },

    /**
     * 生命周期函数--监听页面显示
     */
    onShow() {
        // this.getTabBar().init();
        this.getData()
    },
    changeTab(val) {
        let n = val.detail.index;
        // console.log(n)
        this.setData({
            active: n
        })
    },
})