輸入的資料:[{"serverName":"s02","type":"ASHyperEdge","status":"200"},{"serverName":"s01","type":"ASLog","status":"404"},{"serverName":"s04","type":"ASManager","status":"200"},{"serverName":"aaaa17","type":"ASHyperEdge","status":"404"}]

                
var map = new Map();
//提取的資料,以type為一組,顯示紅,綠,灰燈。200為綠燈,100為灰燈,其他的為紅燈。若一組資料中有紅燈,及綠燈和灰燈,以紅燈為主。若一組資料中有綠燈及灰燈,就以灰燈為主,若只有灰燈,就顯示灰燈。
for (var i = 0; i < result.length; i++) {
    var id = "#" + result[i].serverName;
    var type = result[i].type;
    var status = result[i].status;
    if(!(status === '200' || status === '100')){
        status = '0';
    }
    
    if (map.get(type) == null) {
        map.set(type, status);
        
    } else {
        //如果是紅燈,就不用判斷其他燈號了。
        if (map.get(type) == "0") {
            break;
        }
        //若是綠燈,只要判斷下一個燈是不是紅燈
        else if(map.get(type) == "200") {
            if(status === '0') {
                map.set(type, "0");
            }
        }else {
            //若是灰燈,則判斷下個燈號是紅燈還是綠燈。
            if(status === "0") {
                map.set(type, "0");
            }else if(status ==="200") {
                map.set(type, "200");
            }
        }
    }
}

//利用jquery設定狀態燈號
map.forEach((status, type) => {
    var light;
    if (status === '200') {
        light = './img/greenball.png';
    } else if (status === '100') {
        light = './img/greyball.png';
    } else if (status === '0'){
        light = './img/redball.png';
    }
    var typeName;
    //                console.log(type)

    if (type === 'ASManager') {
        typeName = "#ASManager";
    } else if (type === 'ASHyperEdge') {
        typeName = "#ASHyperEdge";
    } else if (type === 'ASLog') {
        typeName = "#ASLog";
    }
    
    //輸出資料
    $(typeName).attr('src', light);

})

arrow
arrow
    文章標籤
    JS
    全站熱搜
    創作者介紹
    創作者 jbuduoo 的頭像
    jbuduoo

    程式員:告一個段落才能睡的好。

    jbuduoo 發表在 痞客邦 留言(0) 人氣()