let table, layer, form;
let fontSize = '14', fontFamily = 'Alibaba PuHuiTi R', fontColor = '#fff';

const bidCode = parent.$('#bidPro').val();
layui.use(["layer", "table", "form"], function () {
    layer = layui.layer;
    table = layui.table;
    form = layui.form;
    // getDeviceEcharts();

    //效率整体情况
    getWorkztqk();
    //效率分析top5
    getWorkfx();
    //一周到岗人数趋势
    getWorkEcharts();
    //资源应用利率控制层
    getWorkZy()

});

function getWorkztqk(){
    const url =
        commonUrl +
        "screen/resourceUtilization/selectDeviceWorkerEfficiency";
    ajaxRequestGet(
        url,
        "GET",
        true,
        function () {
        },
        function (result) {
            if (result.code === 200) {
                setData(result);
            } else if (result.code === 500) {
                setData(result);
            } else if (result.code === 401) {
                loginout(1);
            }
        },
        function (xhr, status, error) {
            errorFn(xhr, status, error);
            setData(null);
        },
        aqEnnable
    );

    function setData(data) {
        if(data.code === 200){
            let deviceUtilization = data.data.deviceUtilization; //设备利用率
            document.getElementById("deviceUtilization").innerHTML = deviceUtilization +'<span>%</span>';

            let todayDutyRate = data.data.todayDutyRate;  //今日到岗率
            document.getElementById("todayDutyRate").innerHTML = todayDutyRate +'<span>%</span>';

            let workerUtilization = data.data.workerUtilization; //人员利用率
            document.getElementById("workerUtilization").innerHTML = workerUtilization +'<span>%</span>';
            let yesterdayDutyRate = data.data.yesterdayDutyRate; //昨日到岗率
            document.getElementById("yesterdayDutyRate").innerHTML = yesterdayDutyRate +'<span>%</span>';

        }else{
            layer.msg(data.msg || "暂无数据");

        }
    }
}

function getWorkfx(){
    const url =
        commonUrl +
        "screen/resourceUtilization/selectTeamEfficiencyEcharts";
    ajaxRequestGet(
        url,
        "GET",
        true,
        function () {
        },
        function (result) {
            if (result.code === 200) {
                setData(result);
            } else if (result.code === 500) {
                setData(result);
            } else if (result.code === 401) {
                loginout(1);
            }
        },
        function (xhr, status, error) {
            errorFn(xhr, status, error);
            setData(null);
        },
        aqEnnable
    );

    function setData(data) {
        if(data.code === 200){
            let efficiency = data.data; // 效率分析
            getEfficiencyTable(efficiency)
        }else{
            layer.msg(data.msg || "暂无数据");

        }
    }
}

function getWorkEcharts(){
    const url =
        commonUrl +
        "screen/resourceUtilization/selectWeekOnDutyEcharts";
    ajaxRequestGet(
        url,
        "GET",
        true,
        function () {
        },
        function (result) {
            if (result.code === 200) {
                setData(result);
            } else if (result.code === 500) {
                setData(result);
            } else if (result.code === 401) {
                loginout(1);
            }
        },
        function (xhr, status, error) {
            errorFn(xhr, status, error);
            setData(null);
        },
        aqEnnable
    );

    function setData(data) {
        if(data.code === 200){
            let workerEcharts = data.data; //一周到岗人数趋势
            getTrend(workerEcharts)
        }else{
            layer.msg(data.msg || "暂无数据");

        }
    }
}

function getWorkZy(){
    const url =
        commonUrl +
        "screen/resourceUtilization/selectDeviceEcharts";
    ajaxRequestGet(
        url,
        "GET",
        true,
        function () {
        },
        function (result) {
            if (result.code === 200) {
                setData(result);
            } else if (result.code === 500) {
                setData(result);
            } else if (result.code === 401) {
                loginout(1);
            }
        },
        function (xhr, status, error) {
            errorFn(xhr, status, error);
            setData(null);
        },
        aqEnnable
    );

    function setData(data) {
        if(data.code === 200){
            let deviceEchartsList = data.data; //设备情况的echarts
            getDeviceEchartsList(deviceEchartsList)
        }else{
            layer.msg(data.msg || "暂无数据");

        }
    }
}

function getTrend(workerEcharts) {
    let date =[];
    let actualCount =[]; //实到
    let shouldCount =[]; //应到
    if(workerEcharts){
        for (let i = 0; i < workerEcharts.length; i++) {
            date.push(workerEcharts[i].date)
            actualCount.push(workerEcharts[i].actualCount)
            shouldCount.push(workerEcharts[i].shouldCount)
        }
    }
    initTrend(date, actualCount, shouldCount)
}

function initTrend(date,actualCount,shouldCount) {
    const leftChart = echarts.init(document.getElementById("trend"));
    const option =  {
        tooltip: {
            show:true,
            trigger: 'axis',
            axisPointer: {
                type: 'shadow',
            },
            borderColor: 'rgba(255,255,255,.3)',
            backgroundColor: 'rgba(19,51,55,.6)',
            textStyle: {
                color: 'white', //设置文字颜色
            },
            borderWidth: 1,
            padding: 10,
        },
        legend: {
            show:true,
            top:25,
            right:20,
            textStyle:{
                color:'#ffffff'
            }
        },
        grid: {
            top: '30%',
            left: '8%',
            right: '4%',
            bottom: '15%'
        },
        xAxis: [
            {
                type: 'category',
                boundaryGap: true,
                axisLine: {
                    //坐标轴轴线相关设置。数学上的x轴
                    show: true,
                    lineStyle: {
                        color: '#5A6E71',
                    },
                },
                axisLabel: {
                    //坐标轴刻度标签的相关设置
                    textStyle: {
                        color: fontColor,
                        fontSize: fontSize,
                        fontFamily: fontFamily
                    },
                },
                splitLine: {
                    show: false,
                    lineStyle: {
                        color: '#233653',
                    },
                },
                axisTick: {
                    show: true,
                },
                data: date,
            },
        ],
        yAxis: [{
            min: 0,
            splitNumber: 10,
            splitLine: {
                show: true,
                lineStyle: {
                    color: 'rgba(255,255,255,0.6)',
                    type: 'dashed',
                },
            },
            axisLine: {
                show: false,
            },
            axisLabel: {
                show: true,
                textStyle: {
                    color: 'rgba(255,255,255,0.8)',
                    padding: 16
                },
                formatter: function(value) {
                    if (value === 0) {
                        return value
                    }
                    return value
                }
            },
            axisTick: {
                show: false,
            },
        }],
        "dataZoom": [{
            "show": true,
            "height": 12,
            "xAxisIndex": [
                0
            ],
            bottom:'8%',
            "start": 10,
            "end": 90,
            handleIcon: 'path://M306.1,413c0,2.2-1.8,4-4,4h-59.8c-2.2,0-4-1.8-4-4V200.8c0-2.2,1.8-4,4-4h59.8c2.2,0,4,1.8,4,4V413z',
            handleSize: '110%',
            handleStyle:{
                color:"#d3dee5",

            },
            textStyle:{
                color:"#fff"},
            borderColor:"#90979c"
        }, {
            "type": "inside",
            "show": true,
            "height": 15,
            "start": 1,
            "end": 35
        }],
        series: [{
            name: '实到',
            type: 'line',
            symbol: 'circle',
            showAllSymbol: true,
            symbolSize: 0,
            smooth: true,
            lineStyle: {
                normal: {
                    width: 2,
                    color: "#00FEFC",
                }
            },
            itemStyle: {
                color: "#00FEFC",
                borderWidth: 2
            },
            tooltip: {
                show: true
            },
            areaStyle: {
                normal: {
                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                        offset: 0,
                        color: "rgba(18,86,100,0.6)"
                    },
                        {
                            offset: 1,
                            color: "rgba(16,72,81, 0.7)"
                        }
                    ], false),
                    shadowColor: 'rgba(15,55,63, 0.8)',
                    shadowBlur: 20
                }
            },
            data: actualCount
        }, {
            name: '应到',
            type: 'line',
            symbol: 'circle',
            showAllSymbol: true,
            symbolSize: 0,
            smooth: true,
            lineStyle: {
                normal: {
                    width: 2,
                    color: "rgba(25,196,134, 1)",
                }
            },
            itemStyle: {
                color: "rgba(25,196,134, 1)",
                borderWidth: 2

            },
            tooltip: {
                show: true
            },
            areaStyle: {
                normal: {
                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                        offset: 0,
                        color: "rgba(17,95,82, 0.6)"
                    },
                        {
                            offset: 1,
                            color: "rgba(16,72,67, 0.7)"
                        }
                    ], false),
                    shadowColor: 'rgba(15,55,54, 0.8)',
                    shadowBlur: 20
                }
            },
            data: shouldCount
        }]
    };

    leftChart.setOption(option);
    // 响应式调整
    window.addEventListener("resize", function () {
        leftChart.resize();
    });
}

function getEfficiencyTable(efficiency){

    // 确保 efficiency 是数组且不为空
    const tableData = efficiency && efficiency.length > 0 ? efficiency : [];

    if (tableData.length === 0) {
        console.log('没有数据可显示');
        // 可以显示空数据提示
        document.getElementById('dome1').innerHTML = '<div class="no-data">暂无数据</div>';
        return;
    }

    table.render({
        elem: '#dome1',
        data: tableData,
        skin: 'line',
        page: false,
        headers:{
            decrypt:"decrypt",
            "Authorization":token
        },
        cols: [[
            {field: 'number', width:'10%',title: '序号', align: 'center', type: 'numbers'},
            {field: 'workType', width:'20%', align: 'center', title: '专业'},
            {field: 'teamName', width:'20%', align: 'center', title: '班组'},
            {field: 'teamLeader', width:'15%', align: 'center', title: '班组负责人'},
            {field: 'totalPeople', width:'15%', align: 'center', title: '班组人数'},
            {field: 'utilizationRate', width:'20%', align: 'center', title: '利用率',
                templet: function(d){
                    return d.utilizationRate ? d.utilizationRate + '%' : '0%';
                }
            },
        ]],
        initComplete: function () {
            // 在表格渲染完成后，重新渲染序号列
            var that = this.elem.next();
            var tool = that.children('.layui-table-box').children('.layui-table-fixed').children('.layui-table-body').children('.layui-table');
            tool.find("tr").each(function (index, item) {
                $(this).find('td[data-field="LAY_TABLE_INDEX"]').text(index + 1);
            });
        },
        done:function(res, curr, count, origin){
            console.log(res);
        }
    })

}

function getDeviceEchartsList(deviceEchartsList){
    let devName =[];
    let einDay =[];
    let usedDay =[];
    if(deviceEchartsList){
        for (let i = 0; i < deviceEchartsList.length; i++){
            devName.push(deviceEchartsList[i].devName);
            einDay.push(deviceEchartsList[i].einDay);
            usedDay.push(deviceEchartsList[i].usedDay);
        }
    }
    initDeviceEcharts(devName,einDay,usedDay)
}

function initDeviceEcharts(devName,einDay,usedDay) {
    let myChart = echarts.init(document.getElementById("equipmentStatus"));
    const colorArr1 = ["#1CFFA3", "#1CFFA3", "#1CFFA3"];
    const colorArr2 = ["#00FEFC", "#00FEFC", "#00FEFC"];
    var color1 = {
        type: "linear",
        x: 0,
        x2: 1,
        y: 0,
        y2: 0,
        colorStops: [
            {
                offset: 0,
                color: colorArr1[0],
            },
            {
                offset: 0.5,
                color: colorArr1[0],
            },
            {
                offset: 0.5,
                color: colorArr1[1],
            },
            {
                offset: 1,
                color: colorArr1[1],
            },
        ],
    };
    var color2 = {
        type: "linear",
        x: 0,
        x2: 1,
        y: 0,
        y2: 0,
        colorStops: [
            {
                offset: 0,
                color: colorArr2[0],
            },
            {
                offset: 0.5,
                color: colorArr2[0],
            },
            {
                offset: 0.5,
                color: colorArr2[1],
            },
            {
                offset: 1,
                color: colorArr2[1],
            },
        ],
    };
    var barWidth = 18;
    const option = {
        legend: {
            top: '13%',
            right: '3%',
            textStyle: {
                fontSize: 12,
                color: '#FFF',
            },
            selectedMode: false, // 图例点击失效
            icon: 'circle', // 设置图例标记为圆点
            itemWidth: 12,
            itemHeight: 10,
            itemGap: 15, // 调整图标与文本之间的距离
        },
        //图表大小位置限制
         grid: {
            x: '5%',
            x2: '2%',
            y: '25%',
            y2: '15%',
        },
        xAxis: {
            data: devName,
            //坐标轴
            axisLine: {
                show: true,
                lineStyle: {
                    width: 1,
                    color: '#214776'
                },
                textStyle: {
                    color: '#fff',
                    fontSize: '10'
                }
            },
            type: 'category',
            axisLabel: {
                textStyle: {
                    color: '#C5DFFB',
                    fontWeight: 500,
                    fontSize: '14'
                }
            },
            axisTick: {
                textStyle: {
                    color: '#fff',
                    fontSize: '16'
                },
                show: false,
            },
            axisLine: {
                //坐标轴轴线相关设置。数学上的x轴
                show: true,
                lineStyle: {

                    color: '#DEDEDE',
                },
            },
        },
        yAxis: {
            type: 'value',
            splitLine: {
                show: true,
                lineStyle: {
                    type: 'dashed',//线的类型 虚线0
                    opacity: 0.2//透明度
                },
            },
            axisTick: {
                show: false
            },
            axisLine: {
                show: false,
            },
            //坐标值标注
            axisLabel: {
                show: true,
                textStyle: {
                    color: '#C5DFFB',
                }
            },
        },
        "dataZoom": [{
            "show": true,
            "height": 12,
            "xAxisIndex": [
                0
            ],
            bottom:'8%',
            "start": 10,
            "end": 90,
            handleIcon: 'path://M306.1,413c0,2.2-1.8,4-4,4h-59.8c-2.2,0-4-1.8-4-4V200.8c0-2.2,1.8-4,4-4h59.8c2.2,0,4,1.8,4,4V413z',
            handleSize: '110%',
            handleStyle:{
                color:"#d3dee5",

            },
            textStyle:{
                color:"#fff"},
            borderColor:"#90979c"
        }, {
            "type": "inside",
            "show": true,
            "height": 15,
            "start": 1,
            "end": 35
        }],
        series: [
            {
                z: 1,
                name: '入场天数',
                type: "bar",
                barWidth: barWidth,
                barGap: "0%",
                data: einDay,
                itemStyle: {
                    normal: {
                        color: color1,
                    }
                },
            },
            {
                z: 3,
                name: '入场天数',
                type: "pictorialBar",
                symbolPosition: "end",
                data: einDay,
                symbol: "diamond",
                symbolOffset: ["-75%", "-60%"],
                symbolSize: [18, 12],
                itemStyle: {
                    normal: {
                        borderWidth: 2,
                        color: colorArr1[2]
                    },
                },
            },
            {
                z: 1,
                name: '使用天数',
                type: "bar",
                barWidth: barWidth,
                barGap: "50%",
                data: usedDay,
                itemStyle: {
                    normal: {
                        color: color2,
                    }
                },
            },
            {
                z: 3,
                name: '使用天数',
                type: "pictorialBar",
                symbolPosition: "end",
                data: usedDay,
                symbol: "diamond",
                symbolOffset: ["75%", "-60%"],
                symbolSize: [18, 12],
                itemStyle: {
                    normal: {
                        borderWidth: 2,
                        color: colorArr2[2]
                    },
                },
                tooltip: {
                    show: false,
                },
            },
        ],
    }
    myChart.setOption(option, true);
    window.addEventListener("resize", function () {
        myChart.resize();
    });
}