$(() => {
    moduleTitle()
    // 公共请求地址
    let url = '/broad/month'

    // 轮询间隔时间
    const INTERVAL = 30000

    autoUpdate(url + "/selectUserSatisfaction", INTERVAL, data => {
        multipleVerticalBarChartTwo({
            xName: ['产品体验', "购物体验", "服务体验", "订单履行率"],
            yDataOne: [data[0].productRate, data[0].shoppingRate, data[0].serviceRate, data[0].orderRate],
            yDataOneName: '' + data.map(val => val.yearName)[0],
            yDataTwo: [data[1].productRate, data[1].shoppingRate, data[1].serviceRate, data[1].orderRate],
            yDataTwoName: '' + data.map(val => val.yearName)[1],
        }, document.getElementById("satisfaction"), undefined, '%')
    })

    autoUpdate(url + "/selectMonthNumberQaS", INTERVAL, data => {
        multipleVerticalBarChartTwo({
            xName:data.map(val => `${val.monthName}月`),
            yDataOne: data.map(val => val.bhNumber),
            yDataOneName: '闭环数',
            yDataTwo: data.map(val => val.qaNumber),
            yDataTwoName: "隐患数",
        }, document.getElementById("safe"), '')
    })
    autoUpdate(url + "/selectMonthQANumber", INTERVAL, data => {
        console.log(data)
        pieChart(data.map((val,index) => {
            if (index == 0 ) {
                return {
                    name: val.name,
                    value: val.rate,
                    itemStyle: {
                        color: 'red',
                    }
                }
            }
            if (index == 1) {
                return {
                    name: val.name,
                    value: val.rate,
                    itemStyle: {
                        color: 'yellow',
                    }
                }
            }
            return {
                name: val.name,
                value: val.rate
            }

        }), document.getElementById("abnormal"),'%');
    })
    autoUpdate(url + "/selectProductInStoreGroupMonth", INTERVAL, data => {

        total(data.map(val => val.qty).reduce((val1, val2) => val1 + val2, 0), '#total')
        verticalBarChart({
            xName: data.map(val => `${val.name}月`),
            yData: data.map(val => val.qty),
        }, document.getElementById("outputStatistics"), '')
    })
    autoUpdate(url + "/selectHighlightProducts", 40000, data => {
        let url = data.map(val => val.picturePath)
        // $('#HighlightOne').css({backgroundImage: `url("http://10.100.70.5:9090/${url[0]}")`})
        // $('#HighlightTwo').css({backgroundImage: `url("http://10.100.70.5:9090/${url[1]}")`})
        // $('#HighlightThree').css({backgroundImage: `url("http://10.100.70.5:9090/${url[2]}")`})
        // $('#HighlightFour').css({backgroundImage: `url("http://10.100.70.5:9090/${url[3]}")`})
        $('#HighlightOne').attr("src" , `http://10.100.70.5:9090/${url[0]}`)
        $('#HighlightTwo').attr("src" , `http://10.100.70.5:9090/${url[1]}`)
        $('#HighlightThree').attr("src" , `http://10.100.70.5:9090/${url[2]}`)
        $('#HighlightFour').attr("src" , `http://10.100.70.5:9090/${url[3]}`)
        let options = {
            navButton:false,
            sideButton:false,
            effects: ['fade', 'slideX', 'slideY', 'page', 'circle', 'rollingX', 'rollingY', 'blindsX', 'blindsY'],
            data: [
                {
                    src: `http://10.100.70.5:9090/${url[0]}`,
                },
                {
                    src: `http://10.100.70.5:9090/${url[1]}`,
                },
                {
                    src: `http://10.100.70.5:9090/${url[2]}`,
                },
                {
                    src: `http://10.100.70.5:9090/${url[3]}`,
                }
            ]
        };
        $('#slide').vmcSlide(options);
    })
    autoUpdate(url + "/selectBaseQilist", 40000, data => {
        console.log(data)
        lineChart(null, document.getElementById("quality"))
    })
    autoUpdate(url + "/selectDtNenglist", INTERVAL, data => {
        let month = ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"]
        let value = []
        for (let i = 1; i <= 12; i++) {
            if(data[0][`month${i}`]){
                value.push(data[0][`month${i}`])
            }
        }
        lineChart({
            xName: month.splice(0,value.length),
            yData: value,
            yDataName: "能耗百分比"
        }, document.getElementById("energyConsumption"), '')
    })


})

const curWeek = () => {
    let today = new Date();
    let firstDayOfYear = new Date(today.getFullYear(), 0, 1);
    let dayOfWeek = firstDayOfYear.getDay();
    let spendDay = 1;
    if (dayOfWeek != 0) {
        spendDay = 7 - dayOfWeek + 1;
    }
    firstDayOfYear = new Date(today.getFullYear(), 0, spendDay);
    let d = Math.ceil((today.valueOf() - firstDayOfYear.valueOf()) / 86400000);
    return Math.ceil((d / 7) + 1);
}

const moduleTitle = () => {
    const html = `
    <span style="position: absolute;top: 2.9%;left: 50%;color: #fff;font-size: 1.1vw;transform: translateX(-50%);letter-spacing: 0.3vw">智能冷柜中央管控平台</span>
    <span style="position: absolute;top: 14.5%;left: 2.6%;color: #CFD2D0;font-size: 1.0vw">用户满意度</span>
    <span style="position: absolute;top: 14.5%;left: 27.6%;color: #CFD2D0;font-size: 1.0vw">产品升级</span>
    <span style="position: absolute;top: 14.5%;left: 68%;color: #CFD2D0;font-size: 1.0vw">场景升级</span>
    <span style="position: absolute;top: 14.5%;left: 92%;color: #CFD2D0;font-size: 1.0vw">品质提升</span>
    <span style="position: absolute;top: 57.8%;left: 3.3%;color: #CFD2D0;font-size: 1.0vw">产量统计</span>
    <span style="position: absolute;top: 57.8%;left: 27.6%;color: #CFD2D0;font-size: 1.0vw">单台能耗</span>
    <span style="position: absolute;top: 57.8%;left: 68%;color: #CFD2D0;font-size: 1.0vw">质量分析</span>
    <span style="position: absolute;top: 57.8%;left: 93%;color: #CFD2D0;font-size: 1.0vw">安全生产</span>
    `
    $('body').append(html)
}

const total = (val1 = 0, el) => {
    const html = `
    <span style="position: absolute;top: 54.2%;left: 10.7%;color: #fff;font-size: 1vw;">${new Date().getFullYear()}年 合计：${val1} 台</span>
    `
    $(el).html(html)
}