上傳檔案到 'static'

static/home.js

@@ -1,270 +1,271 @@
-start();
-user_role = '';
-data = '';
-obj = '';
-check = 0;
-// 之後透過 fetch 取得fastapi後端資料!
-function start(){
-    var xhr = new XMLHttpRequest();
-    var url = "home/show";
-    obj = "";
-    xhr.open("GET",url);
-    xhr.onload = function(){
-        obj = JSON.parse(xhr.responseText);
-        data = obj ;
-        console.log(data);
-        document.getElementById('company_text').innerHTML=data[1][0].company;
-        document.getElementById('factory_text').innerHTML=data[1][0].factory;
-        document.getElementById('department_text').innerHTML=data[1][0].department;
-        if(data[0].user_role==1){
-            company_show();
-        }
-        else if(data[0].user_role==2){
-            factory_show(data[1][0].company);
-        }
-        else if(data[0].user_role==3){
-            department_show(data[1][0].company,data[1][0].department);
-            department_change();
-        }
-        else{
-            towerGroup_show();  
-        }
-            //insertHTML();
-    };
-    xhr.send();
-    
-    console.log('Start');
-}
-
-function get_user_role(){
-    user_role = data[0].user_role
-}
-
-function clear(){
-    document.getElementById('company').innerHTML='';
-    document.getElementById('towergroup').innerHTML='';
-    document.getElementById('company_name').innerHTML='';
-    document.getElementById('factory_select').innerHTML='';
-    document.getElementById("map").style.display="none";
-    document.getElementById('department_show').innerHTML="";
-    document.getElementById("department_list").style.display="none";
-}
-
-function company_show(){
-    //顯示company按鈕
-    var inner='';
-    var company_arr = new Array();
-    check = 0;
-    for(var i=0;i<obj[1].length;i++){
-        if(company_arr.indexOf(obj[1][i].company)==-1){
-            inner+="<button class='btn text-white' id='company " +obj[1][i].company+ "' onclick=\"factory_show(\'"+obj[1][i].company+"\');\"";
-            inner += ">公司"+obj[1][i].company+"</button>";
-            company_arr.push(obj[1][i].company);
-            console.log(obj[1][i].company);
-        }
-    }
-    clear();
-    document.getElementById('company').innerHTML=inner;
-    company_health(company_arr);
-}
-
-function company_health(company_arr){
-    //使公司按鈕變色
-    for(var i=0;i<company_arr.length;i++){
-        //初始化(健康)
-        document.getElementById('company ' + company_arr[i]).style.background="green";
-    }
-    for(var i=0;i<obj[1].length;i++){
-        if(obj[1][i].health!=1 && obj[1][i].company==document.getElementById('company_text').innerHTML){
-            //有不健康的就改色
-            document.getElementById('company ' + obj[1][i].company).style.background="red";
-        }
-    }
-}
-
-// function factory_show(company){
-//     var inner='<p class="fw-bold">廠區資訊:</p>';
-//     var factory_arr = new Array();
-//     for(var i=0;i<obj[1].length;i++){
-//         if(factory_arr.indexOf(obj[1][i].factory)==-1 && obj[1][i].company==company){
-//             inner+="<button class='btn text-white m-1' id='factory " +obj[1][i].factory+ "' onclick=\"department_show(\'"+obj[1][i].company+"\',\'"+obj[1][i].factory+"\');\"";
-//             inner += ">廠區"+obj[1][i].factory+"</button><br>";
-//             factory_arr.push(obj[1][i].factory);
-//         }
-//     }
-//     //測試用
-//     inner+="<button class='btn btn btn-outline-success m-1' id='factory B' onclick=\"department_show(\'"+obj[1][0].company+"\',\'B\');\"";
-//     inner += ">廠區B</button><br>";
-//     inner+="<button class='btn btn btn-outline-success m-1' id='factory C' onclick=\"department_show(\'"+obj[1][0].company+"\',\'C\');\"";
-//     inner += ">廠區C</button><br>";
-//     document.getElementById('company').innerHTML="";
-//     document.getElementById('company_name').innerHTML="<button type='button' class='btn btn-primary m-1' onclick=\"company_show();\">返回</button> 公司"+ company + "";
-//     document.getElementById('factory_select').innerHTML=inner;
-//     factory_health(factory_arr);
-//     document.getElementById("map").style.display="";
-    
-// }
-function factory_show(company){
-    var inner='<p class="fw-bold">廠區資訊</p>';
-    var factory_arr = new Array();
-    for(var i=0;i<obj[1].length;i++){
-        if(factory_arr.indexOf(obj[1][i].factory)==-1 && obj[1][i].company==company){
-            inner+="<button type='button' class='btn text-white m-1' id='factory " +obj[1][i].factory+ "' onclick=\"department_show(\'"+obj[1][i].company+"\',\'"+obj[1][i].factory+"\');\"";
-            inner += ">廠區"+obj[1][i].factory+"</button>";
-            factory_arr.push(obj[1][i].factory);
-        }
-    }
-    //測試用
-    inner+="<button type='button' class='btn btn btn-outline-success m-1' id='factory B' onclick=\"department_show(\'"+obj[1][0].company+"\',\'B\');\"";
-    inner += ">廠區B</button>";
-    inner+="<button type='button' class='btn btn btn-outline-success m-1' id='factory C' onclick=\"department_show(\'"+obj[1][0].company+"\',\'C\');\"";
-    inner += ">廠區C</button>";
-    document.getElementById('company').innerHTML="";
-    document.getElementById('company_text').innerHTML=company;
-    document.getElementById('company_name').innerHTML="<button type='button' class='btn btn-primary m-1' onclick=\"company_show();\">返回</button> 公司"+ company + "";
-    document.getElementById('factory_select').innerHTML=inner;
-    factory_health(factory_arr);
-    document.getElementById("map").style.display="";
-    
-}
-
-function factory_health(factory_arr){
-    //使工廠按鈕變色
-    for(var i=0;i<factory_arr.length;i++){
-        //初始化(健康)
-        document.getElementById('factory ' + factory_arr[i]).style.background="green";
-    }
-    for(var i=0;i<obj[1].length;i++){
-        if(obj[1][i].health!=1){
-            //有不健康的改色
-            document.getElementById('factory ' + obj[1][i].factory).style.background="red";
-        }
-    }
-}
-
-function department_show(company,factory){
-    var inner='';
-    var department_arr = new Array();
-    for(var i=0;i<obj[1].length;i++){
-        if(department_arr.indexOf(obj[1][i].department)==-1 && obj[1][i].company==company&& obj[1][i].factory==factory){
-            inner+='<option selected value="'+obj[1][i].department+'">課'+obj[1][i].department+'</option>';
-            department_arr.push(obj[1][i].department);
-        }
-    }
-    document.getElementById('company_text').innerHTML=company;
-    document.getElementById('factory_text').innerHTML=factory;
-    document.getElementById('department_list').innerHTML=inner;
-    console.log("click");
-    if(factory==='A'){
-        newLocation(25.0339031,121.5623212);
-    }
-    else if(factory==='B'){
-        newLocation(24.42,121.42);
-    }
-    else if(factory==='C'){
-        newLocation(24.12,121.42);
-    }
-    clear();
-    if(check ===0) {
-        factory_show(company);
-    }
-    document.getElementById('company_name').innerHTML="<button type='button' class='btn btn-primary m-1' onclick=\"factory_show('"+company+"');\">返回</button> 廠區"+ factory + "";
-    document.getElementById("department_list").style.display="";
-    department_change();
-}
-
-function department_change(){
-    console.log("change");
-    check = 0 ;
-    var inner='<table style="font-size: 16px;" class="table text-center"><thead><tr><th>機組</th><th>健康狀態</th><th>機組狀態</th></tr></thead>';
-    var tower_group_arr = new Array();
-    for(var i=0;i<obj[1].length;i++){
-        if(tower_group_arr.indexOf(obj[1][i].group)==-1 && obj[1][i].company==document.getElementById('company_text').innerHTML&& obj[1][i].factory==document.getElementById('factory_text').innerHTML&& obj[1][i].department==document.getElementById("department_list").value){
-            inner+='<tr><td>' + obj[1][i].group + '</td><td>健康</td><td><button class="btn btn-primary m-1" onclick=\"towerGroup_show();\">查看</button></td></tr><tr><td>2</td><td>健康</td><td><button class="btn btn-primary m-1" onclick=\"towerGroup_show();\">查看</button></td></tr><tr><td>3</td><td>健康</td><td><button class="btn btn-primary m-1" onclick=\"towerGroup_show();\">查看</button></td></tr>' ;
-            tower_group_arr.push(obj[1][i].group);
-        }
-    }
-    inner += '</table>';
-    document.getElementById('department_text').innerHTML=document.getElementById("department_list").value;
-    document.getElementById('department_show').innerHTML=inner;
-    
-}
-
-function towerGroup_show(){
-    check = 1;
-    var inner= '';
-    var tower_group_arr = new Array(); 
-    for(var i=0;i<obj[1].length;i++){
-        if(tower_group_arr.indexOf(obj[1][i].group)==-1 && obj[1][i].company==document.getElementById('company_text').innerHTML&& obj[1][i].factory==document.getElementById('factory_text').innerHTML&& obj[1][i].department==document.getElementById("department_text").innerHTML){
-            inner += tower(obj[1][i].group);
-            tower_group_arr.push(obj[1][i].group);
-        }
-    }
-    clear();
-    company = document.getElementById('company_text').innerHTML
-    factory= document.getElementById('factory_text').innerHTML
-    document.getElementById('company_name').innerHTML="<button type='button' class='btn btn-primary m-1' onclick=\"department_show('"+company+"','" + factory+"');\">返回</button> 課"+ document.getElementById("department_list").value + "";
-    document.getElementById('towergroup').innerHTML=inner;
-}
-
-function tower(tower_group){
-    //顯示tower
-    var inner= '<p class="fw-bold">機組'+tower_group +'</p><table style="font-size: 16px;" class="table text-center"><tr><th>設備</th><th>馬達效能</th><th>機組狀態</th></tr>';
-    for(var i=0;i<obj[1].length;i++){
-        if(obj[1][i].company==document.getElementById('company_text').innerHTML&& obj[1][i].factory==document.getElementById('factory_text').innerHTML&& obj[1][i].department==document.getElementById("department_text").innerHTML&&obj[1][i].group==tower_group){
-            inner+='<tr><td>' + obj[1][i].tower + '</td><td>健康</td><td><button class="btn btn-primary m-1">查看</button></td></tr>';
-        }
-    }
-
-    inner += '</table>'
-    return inner;
-}
-
-function newLocation(newLat,newLng)
-{
-	map.setCenter({
-		lat : newLat,
-		lng : newLng
-	});
-    addmarker(newLat,newLng);
-}
-
-var map;
-function initMap() {
-    var position = {
-        lat: 25.0339031,
-        lng: 121.5623212
-    };
-    map = new google.maps.Map(document.getElementById('map'), {
-        center: position,
-        zoom: 14
-    });
-    var marker = new google.maps.Marker({
-    position: position,
-    map: map
-  });
-}
-
-function addmarker(lat,lng){
-    var myLatlng = new google.maps.LatLng(lat,lng);
-    var marker = new google.maps.Marker({
-        position: myLatlng,
-    });
-    console.log("yes");
-    // To add the marker to the map, call setMap();
-    marker.setMap(map);
-}
-
-function clearMarkers(lat,lng) {
-    var myLatlng = new google.maps.LatLng(lat,lng);
-    marker = google.maps.Marker({
-        position: myLatlng,
-        title:"Hello World!"
-    });
-    markers.setMap(null);
-     
-}
-
-function hide(){
-    document.getElementById("map").style.display="none";//隱藏
-}
+start();
+user_role = '';
+data = '';
+obj = '';
+check = 0;
+// 之後透過 fetch 取得fastapi後端資料!
+function start(){
+    var xhr = new XMLHttpRequest();
+    var url = "home/show";
+    obj = "";
+    xhr.open("GET",url);
+    xhr.onload = function(){
+        obj = JSON.parse(xhr.responseText);
+        data = obj ;
+        console.log(data);
+        document.getElementById('company_text').innerHTML=data[1][0].company;
+        document.getElementById('factory_text').innerHTML=data[1][0].factory;
+        document.getElementById('department_text').innerHTML=data[1][0].department;
+        if(data[0].user_role==1){
+            company_show();
+        }
+        else if(data[0].user_role==2){
+            factory_show(data[1][0].company);
+        }
+        else if(data[0].user_role==3){
+            department_show(data[1][0].company,data[1][0].department);
+            department_change();
+        }
+        else{
+            towerGroup_show();  
+        }
+            //insertHTML();
+    };
+    xhr.send();
+    
+    console.log('Start');
+}
+
+function get_user_role(){
+    user_role = data[0].user_role
+}
+
+function clear(){
+    document.getElementById('company').innerHTML='';
+    document.getElementById('towergroup').innerHTML='';
+    document.getElementById('company_name').innerHTML='';
+    document.getElementById('factory_select').innerHTML='';
+    document.getElementById("map").style.display="none";
+    document.getElementById('department_show').innerHTML="";
+    document.getElementById("department_list").style.display="none";
+}
+
+function company_show(){
+    //顯示company按鈕
+    var inner='';
+    var company_arr = new Array();
+    check = 0;
+    for(var i=0;i<obj[1].length;i++){
+        if(company_arr.indexOf(obj[1][i].company)==-1){
+            inner+="<button class='btn text-white' id='company " +obj[1][i].company+ "' onclick=\"factory_show(\'"+obj[1][i].company+"\');\"";
+            inner += ">公司"+obj[1][i].company+"</button>";
+            company_arr.push(obj[1][i].company);
+            console.log(obj[1][i].company);
+        }
+    }
+    clear();
+    document.getElementById('company').innerHTML=inner;
+    company_health(company_arr);
+}
+
+function company_health(company_arr){
+    //使公司按鈕變色
+    for(var i=0;i<company_arr.length;i++){
+        //初始化(健康)
+        document.getElementById('company ' + company_arr[i]).style.background="green";
+    }
+    for(var i=0;i<obj[1].length;i++){
+        if(obj[1][i].health!=1 && obj[1][i].company==document.getElementById('company_text').innerHTML){
+            //有不健康的就改色
+            document.getElementById('company ' + obj[1][i].company).style.background="red";
+        }
+    }
+}
+
+// function factory_show(company){
+//     var inner='<p class="fw-bold">廠區資訊:</p>';
+//     var factory_arr = new Array();
+//     for(var i=0;i<obj[1].length;i++){
+//         if(factory_arr.indexOf(obj[1][i].factory)==-1 && obj[1][i].company==company){
+//             inner+="<button class='btn text-white m-1' id='factory " +obj[1][i].factory+ "' onclick=\"department_show(\'"+obj[1][i].company+"\',\'"+obj[1][i].factory+"\');\"";
+//             inner += ">廠區"+obj[1][i].factory+"</button><br>";
+//             factory_arr.push(obj[1][i].factory);
+//         }
+//     }
+//     //測試用
+//     inner+="<button class='btn btn btn-outline-success m-1' id='factory B' onclick=\"department_show(\'"+obj[1][0].company+"\',\'B\');\"";
+//     inner += ">廠區B</button><br>";
+//     inner+="<button class='btn btn btn-outline-success m-1' id='factory C' onclick=\"department_show(\'"+obj[1][0].company+"\',\'C\');\"";
+//     inner += ">廠區C</button><br>";
+//     document.getElementById('company').innerHTML="";
+//     document.getElementById('company_name').innerHTML="<button type='button' class='btn btn-primary m-1' onclick=\"company_show();\">返回</button> 公司"+ company + "";
+//     document.getElementById('factory_select').innerHTML=inner;
+//     factory_health(factory_arr);
+//     document.getElementById("map").style.display="";
+    
+// }
+function factory_show(company){
+    var inner='<p class="fw-bold">廠區資訊</p>';
+    var factory_arr = new Array();
+    for(var i=0;i<obj[1].length;i++){
+        if(factory_arr.indexOf(obj[1][i].factory)==-1 && obj[1][i].company==company){
+            inner+="<button type='button' class='btn text-white m-1' id='factory " +obj[1][i].factory+ "' onclick=\"department_show(\'"+obj[1][i].company+"\',\'"+obj[1][i].factory+"\');\"";
+            inner += ">廠區"+obj[1][i].factory+"</button>";
+            factory_arr.push(obj[1][i].factory);
+        }
+    }
+    //測試用
+    inner+="<button type='button' class='btn btn btn-outline-success m-1' id='factory B' onclick=\"department_show(\'"+obj[1][0].company+"\',\'B\');\"";
+    inner += ">廠區B</button>";
+    inner+="<button type='button' class='btn btn btn-outline-success m-1' id='factory C' onclick=\"department_show(\'"+obj[1][0].company+"\',\'C\');\"";
+    inner += ">廠區C</button>";
+    document.getElementById('company').innerHTML="";
+    document.getElementById('company_text').innerHTML=company;
+    document.getElementById('company_name').innerHTML="<button type='button' class='btn btn-primary m-1' onclick=\"company_show();\">返回</button> 公司"+ company + "";
+    document.getElementById('factory_select').innerHTML=inner;
+    factory_health(factory_arr);
+    document.getElementById("map").style.display="";
+    
+}
+
+function factory_health(factory_arr){
+    //使工廠按鈕變色
+    for(var i=0;i<factory_arr.length;i++){
+        //初始化(健康)
+        document.getElementById('factory ' + factory_arr[i]).style.background="green";
+    }
+    for(var i=0;i<obj[1].length;i++){
+        if(obj[1][i].health!=1){
+            //有不健康的改色
+            document.getElementById('factory ' + obj[1][i].factory).style.background="red";
+        }
+    }
+}
+
+function department_show(company,factory){
+    var inner='';
+    var department_arr = new Array();
+    for(var i=0;i<obj[1].length;i++){
+        if(department_arr.indexOf(obj[1][i].department)==-1 && obj[1][i].company==company/*&& obj[1][i].factory==factory*/){
+            inner+='<option selected value="'+obj[1][i].department+'">課'+obj[1][i].department+'</option>';
+            department_arr.push(obj[1][i].department);
+        }
+    }
+    document.getElementById('company_text').innerHTML=company;
+    document.getElementById('factory_text').innerHTML=factory;
+    document.getElementById('department_list').innerHTML=inner;
+    console.log("click");
+    if(factory==='A'){
+        newLocation(25.0339031,121.5623212);
+    }
+    else if(factory==='B'){
+        newLocation(24.42,121.42);
+    }
+    else if(factory==='C'){
+        newLocation(24.12,121.42);
+    }
+    clear();
+    if(check ===0) {
+        factory_show(company);
+    }
+    document.getElementById('company_name').innerHTML="<button type='button' class='btn btn-primary m-1' onclick=\"factory_show('"+company+"');\">返回</button> 廠區"+ factory + "";
+    document.getElementById("department_list").style.display="";
+    department_change();
+}
+
+function department_change(){
+    console.log("change");
+    check = 0 ;
+    var inner='<table style="font-size: 16px;" class="table text-center"><thead><tr><th>機組</th><th>健康狀態</th><th>機組狀態</th></tr></thead>';
+    var tower_group_arr = new Array();
+    for(var i=0;i<obj[1].length;i++){
+        if(tower_group_arr.indexOf(obj[1][i].group)==-1 && obj[1][i].company==document.getElementById('company_text').innerHTML/*&& obj[1][i].factory==document.getElementById('factory_text').innerHTML&& obj[1][i].department==document.getElementById("department_list").value*/){
+            inner+='<tr><td>' + obj[1][i].group + '</td><td>健康</td><td><button class="btn btn-primary m-1" onclick=\"towerGroup_show();\">查看</button></td></tr><tr><td>2</td><td>健康</td><td><button class="btn btn-primary m-1" onclick=\"towerGroup_show();\">查看</button></td></tr><tr><td>3</td><td>健康</td><td><button class="btn btn-primary m-1" onclick=\"towerGroup_show();\">查看</button></td></tr>' ;
+            tower_group_arr.push(obj[1][i].group);
+            console.log(inner);
+        }
+    }
+    inner += '</table>';
+    document.getElementById('department_text').innerHTML=document.getElementById("department_list").value;
+    document.getElementById('department_show').innerHTML=inner;
+    
+}
+
+function towerGroup_show(){
+    check = 1;
+    var inner= '';
+    var tower_group_arr = new Array(); 
+    for(var i=0;i<obj[1].length;i++){
+        if(tower_group_arr.indexOf(obj[1][i].group)==-1 && obj[1][i].company==document.getElementById('company_text').innerHTML/*&& obj[1][i].factory==document.getElementById('factory_text').innerHTML&& obj[1][i].department==document.getElementById("department_text").innerHTML*/){
+            inner += tower(obj[1][i].group);
+            tower_group_arr.push(obj[1][i].group);
+        }
+    }
+    clear();
+    company = document.getElementById('company_text').innerHTML
+    factory= document.getElementById('factory_text').innerHTML
+    document.getElementById('company_name').innerHTML="<button type='button' class='btn btn-primary m-1' onclick=\"department_show('"+company+"','" + factory+"');\">返回</button> 課"+ document.getElementById("department_list").value + "";
+    document.getElementById('towergroup').innerHTML=inner;
+}
+
+function tower(tower_group){
+    //顯示tower
+    var inner= '<p class="fw-bold">機組'+tower_group +'</p><table style="font-size: 16px;" class="table text-center"><tr><th>設備</th><th>馬達效能</th><th>機組狀態</th></tr>';
+    for(var i=0;i<obj[1].length;i++){
+        if(obj[1][i].company==document.getElementById('company_text').innerHTML/*&& obj[1][i].factory==document.getElementById('factory_text').innerHTML&& obj[1][i].department==document.getElementById("department_text").innerHTML*/&&obj[1][i].group==tower_group){
+            inner+='<tr><td>' + obj[1][i].tower + '</td><td>健康</td><td><button class="btn btn-primary m-1">查看</button></td></tr>';
+        }
+    }
+
+    inner += '</table>'
+    return inner;
+}
+
+function newLocation(newLat,newLng)
+{
+	map.setCenter({
+		lat : newLat,
+		lng : newLng
+	});
+    addmarker(newLat,newLng);
+}
+
+var map;
+function initMap() {
+    var position = {
+        lat: 25.0339031,
+        lng: 121.5623212
+    };
+    map = new google.maps.Map(document.getElementById('map'), {
+        center: position,
+        zoom: 14
+    });
+    var marker = new google.maps.Marker({
+    position: position,
+    map: map
+  });
+}
+
+function addmarker(lat,lng){
+    var myLatlng = new google.maps.LatLng(lat,lng);
+    var marker = new google.maps.Marker({
+        position: myLatlng,
+    });
+    console.log("yes");
+    // To add the marker to the map, call setMap();
+    marker.setMap(map);
+}
+
+function clearMarkers(lat,lng) {
+    var myLatlng = new google.maps.LatLng(lat,lng);
+    marker = google.maps.Marker({
+        position: myLatlng,
+        title:"Hello World!"
+    });
+    markers.setMap(null);
+     
+}
+
+function hide(){
+    document.getElementById("map").style.display="none";//隱藏
+}