首页大屏数据交互1

czt

2025-12-25 6a70f946aca610f81245a5e314e9ac2bdf466c91

 fzzy-igdss-web/src/main/resources/static/group/index.js

@@ -1,55 +1,57 @@
var nowClientWidth = document.documentElement.clientWidth; // 当前视口宽度
var hisVarietyChart = null;   // 品种柱状图
var deptAreaAllList = null;   // 所有库区列表信息
var deptAreaList = null;      // 存放切换库区列表信息
var companyList = null;       // 公司信息
var deptList = null;   // 所有库区列表信息
var deptCode = null;          // 当前闪烁地区的编码
var timer1;     // 库区定时
var index1 = 0; // 库区切换下标
var timer2;     // 粮食数量定时
var index2 = 0; // 粮食数量切换下标
var number2 = 2;// 粮食数量切换总数量
var timer3;     // 储量饼图定时
var index3 = 0; // 储量饼图切换下标
var number3 = 2;// 储量饼图切换总数量

var timer;     // 库区定时
var deptNum = 0;  //库区切换下标
var mapChart = null;
var geoMap = [{name: '伊犁哈萨克自治州', value: [81.317946, 43.92186]}]; //默认点位
var map = chinaMapOutline; //默认加载全国地图

$(function () {
    // 初始化页面
    init();

    // 初始化WebSocket
    initWS(companyId,bizType, bizTag, userId);
    // initWS(companyId,bizType, bizTag, userId);
});

// 初始化页面
function init() {
    // 适应屏幕大小
    initScrollbar();
    // 时间
    initTime();

    // 初始化图表
    initChart();
    //初始化标语
    initDicSlogan();

    //初始化地图
    initMap();

    // 时间
    initTime();

    //初始化标语
    initDicSlogan();

    //加载指定地区地图
    renderMapPoints("乌鲁木齐市,克拉玛依市,吐鲁番市,哈密市,昌吉回族自治州,博尔塔拉蒙古自治州,巴音郭楞蒙古自治州,阿克苏地区,克孜勒苏柯尔克孜自治州,喀什地区,和田地区,伊犁哈萨克自治州,塔城地区,阿勒泰地区");

    //TODO 统计相关数量信息，包含库点及粮食数量
    // ajaxFoodNum();
    //统计相关数量信息，包含库点及粮食数量
    ajaxFoodNum();

    //TODO 请求监管库区信息
    // ajaxDeptArea();
    //请求监管库区信息
    ajaxDeptList();

    clearInterval(timer);
    timing();

    //TODO 请求AI事件信息
    // ajaxMsg();

    //TODO 请求抓拍跟踪信息
    // ajaxFoodNum();



    //抓拍跟踪滚动
    jQuery(".block2").slide({ mainCell: ".bd ul", autoPage: true, effect: "topLoop", autoPlay: true, vis: 4 });
@@ -63,6 +65,20 @@
        dicSlogan = data;
        initDicSlogan();
    }
}

/**
 * 库区定时切换
 */
function timing() {
    timer = setInterval(function() {
        if(deptNum === deptList.length){
            deptNum = 0;
        }

        renderDeptInfo();
        deptNum += 1;
    }, 5000);
}

//加载库区地图位置
@@ -96,15 +112,15 @@
    geoMap = [];
    for (var j = 0; j < names.length; j++) {
        for (var i = 0; i < all.length; i++) {
            if(all[i].properties.name == names[j]){
            if(all[i].properties.name === names[j]){
                map.features.push(all[i]);
                if(all[i].properties.name == "伊犁哈萨克自治州"){
                // if(all[i].properties.name === "伊犁哈萨克自治州"){
                    geoMap.push({
                        name: all[i].properties.centerName,
                        value: [all[i].properties.center[0], all[i].properties.center[1], 12]
                    });
                }
                renderMap();
                // }
                // renderMap();
                break;
            }
        }
@@ -273,26 +289,6 @@
}

/**
 * 获取公司信息
 */
function ajaxCompany() {
    $.ajax({
        type: "POST",
        url: "../../visual/index-company",
        dataType: "json",
        contentType: "application/json;charset=UTF-8",
        data: JSON.stringify({
            "companyId": companyId
        }),
        success: function (result) {
            if (result.code == "0000") {
                companyList = result.data;
            }
        }
    });
}

/**
 * 请求获取动态信息
 */
function ajaxMsg() {
@@ -393,25 +389,43 @@
/**
 * 请求获取库区相关信息
 */
function ajaxDeptArea() {
    // $.ajax({
    //     type: "POST",
    //     url: "../../visual/index-dept-area",
    //     dataType: "json",
    //     contentType: "application/json;charset=UTF-8",
    //     data: JSON.stringify({
    //         "companyId": companyId
    //     }),
    //     success: function (result) {
    //         if (result.code == "0000") {
    //             deptAreaAllList = result.data;
    //             getChangeDeptArea(null);
    //         }
    //     },
    //     error: function (error) {
    //
    //     }
    // });
function ajaxDeptList() {
    deptList = null;
    $.ajax({
        type: "POST",
        url: "/group/index-dept-list",
        dataType: "json",
        contentType: "application/json;charset=UTF-8",
        data: JSON.stringify({
            "companyId": companyId
        }),
        success: function (result) {
            if (result.code == "0000") {
                deptList = result.data;
                renderDeptInfo();
            }
        },
        error: function (error) {

        }
    });
}

/**
 * 渲染库区信息
 */
function renderDeptInfo() {
    if (deptList == null || deptList.length <= 0) {
        return;
    }

    $("#county").html(deptList[deptNum].county);
    $("#deptName").html(deptList[deptNum].deptName);
    $("#inNum").html(deptList[deptNum].inNum);
    $("#outNum").html(deptList[deptNum].outNum);
    $("#depotNumber").html(deptList[deptNum].depotNumber);
    $("#depotBankNumber").html(deptList[deptNum].depotBankNumber);
    $("#storageNum").html(deptList[deptNum].storageNum);

    //加载库区地图
    geoMap = updateDeptMap();
@@ -423,12 +437,12 @@
    $.each(deptList, function(index, item) {
        var val = [];
        var name = '';
        // if(index == deptNum){
        //     name = item.name;
        //     val = [item.lon, item.lat, 17];
        // }else {
        if(index === deptNum){
            name = item.deptName;
            val = [item.jd, item.wd, 17];
        }else {
            val = [item.jd, item.wd, 8];
        // }
        }
        points.push({
            name: name,
            value: val
@@ -520,19 +534,19 @@
}

/**
 * 请求获取相关数量信息
 * 请求获取统计数量信息
 */
function ajaxFoodNum() {
    $.ajax({
        type: "POST",
        url: "../../visual/index-food-number",
        url: "/group/index-num",
        dataType: "json",
        contentType: "application/json;charset=UTF-8",
        data: JSON.stringify({
            "companyId": companyId
        }),
        success: function (result) {
            if (result.code == "0000") {
            if (result.code === "0000") {
                var data = result.data;
                renderFoodNum(data);
            }
@@ -543,7 +557,10 @@
    });
}

// 更新库区信息
/**
 * 渲染统计数量信息
 * @param data
 */
function renderFoodNum(data) {

    if (!data) {
@@ -552,24 +569,17 @@

    /*----- 监管库点信息 -----*/
    $("#companyNum").html(data.companyNum);
    $("#deptAreaNum").html(data.deptAreaNum);
    $("#depotSum").html(data.depotNum);
    $("#deptNum").html(data.deptNum);
    $("#depotNum").html(data.depotNum);
    $("#depotBankNum").html(data.depotBankNum);

    /*----- 监管数量信息 -----*/
    if (data.foodSum.length > 8 || data.oilSum.length > 8) {
    if (data.foodSum.length > 8 || data.packFoodSum.length > 8) {
        $("#foodSum").css("font-size", "32px");
        $("#oilSum").css("font-size", "32px");
        $("#packFoodSum").css("font-size", "32px");
    }
    $("#foodSum").html(data.foodSum);
    $("#oilSum").html(data.oilSum);

    if (data.goodsFoodSum.length > 8 || data.goodsOilSum.length > 8) {
        $("#goodsFoodSum").css("font-size", "32px");
        $("#goodsOilSum").css("font-size", "32px");
    }
    $("#goodsFoodSum").html(data.goodsFoodSum);
    $("#goodsOilSum").html(data.goodsOilSum);

    $("#packFoodSum").html(data.packFoodSum);

    /*----- 分品种柱状图 -----*/
    if (data.xaxis.length > 0 && data.seriesData.length > 0) {
@@ -579,125 +589,6 @@
        hisFoodVariety.chart.setOption(hisFoodVariety.option, true);
        hisVarietyChart = hisFoodVariety;
    }

    // 粮食监管数量切换
    foodNumSwitch();
    // 粮食饼图切换
    pieChartSwitch();
}

/* ---------- 粮食数量监管切换 ---------- */
function foodNumSwitch() {
    $(".lb-body .right-topInfo-jg").eq(0).show().siblings().hide();
    StartLunbo();

    $(".lb-tab").hover(function () {
        clearInterval(timer2);
        index2 = $(this).index();
        ShowPicTab();
    }, function () {
        StartLunbo();
    });

    $(".lb-btn1").click(function () {
        clearInterval(timer2);
        index2--;
        if (index2 == -1) {
            index2 = number2 - 1;
        }

        ShowPicTab();
        StartLunbo();
    });

    $(".lb-btn2").click(function () {
        clearInterval(timer2);
        index2++;
        if (index2 == number2) {
            index2 = 0;
        }
        ShowPicTab();
        StartLunbo();
    });
}

function ShowPicTab() {
    if (index2 === 0) {
        $("#foodNumTitle").html("储备粮油");
    } else if (index2 === 1) {
        $("#foodNumTitle").html("商品粮油");
    }
    // else if (index2 === 2) {
    //     $("#foodNumTitle").html("小包装粮油");
    // }
    $(".lb-body .right-topInfo-jg").eq(index2).fadeIn(300).siblings().fadeOut(300);
    $(".lb-tab").eq(index2).addClass("bg").siblings().removeClass("bg");
}

function StartLunbo() {
    timer2 = setInterval(function () {
        index2++;
        if (index2 >= number2) {
            index2 = 0;
        }
        ShowPicTab();
    }, 3000);
}

/* ---------- 粮食饼图切换 ---------- */
function pieChartSwitch() {
    $(".tubiao-Carousel .stats-chart-box").eq(0).show().siblings().hide();
    StartCarousel();

    $(".carousel-tab").hover(function () {
        clearInterval(timer3);
        index3 = $(this).index();
        ShowTubiao();

    }, function () {
        StartCarousel();
    });

    $(".carousel-btn1").click(function () {
        clearInterval(timer3);
        index3--;
        if (index3 == -1) {
            index3 = number3 - 1;
        }

        ShowTubiao();
        StartCarousel();
    });

    $(".carousel-btn2").click(function () {
        clearInterval(timer3);
        index3++;
        if (index3 == number3) {
            index3 = 0;
        }
        ShowTubiao();
        StartCarousel();
    });
}

function ShowTubiao() {
    if (index3 === 0) {
        $("#pieCharTitle").html("粮食数量统计(吨)");
    } else if (index3 === 1) {
        $("#pieCharTitle").html("油脂数量统计(吨)");
    }
    $(".tubiao-Carousel .stats-chart-box").eq(index3).fadeIn(300).siblings().fadeOut(300);
    $(".carousel-tab").eq(index3).addClass("bg").siblings().removeClass("bg");
}

function StartCarousel() {
    timer3 = setInterval(function () {
        index3++;
        if (index3 >= number3) {
            index3 = 0;
        }
        ShowTubiao();
    }, 3000);
}

// 刷新时间
@@ -740,9 +631,10 @@
    return document.getElementById('inventoryInfo').clientHeight > document.getElementById('inventoryInfoBox').clientHeight;
}

// 初始化图表
/**
 * 初始化图表
 */
function initChart() {

    /* 库存图表加载 */
    allInventoryChartLoad(
        ['小麦', '玉米', '稻谷', '成品粮',  '成品油', '其他'],