後台訂單來的時候,進行提醒

Q1. 如何判斷有無新訂單
A1. 在"function"外頭先加入(先設定全域變數)
var lastOrderId = 0;
var lastOrderIdMax = 0;
然後在JSON解析時加入
if (lastOrderId < parseInt(value.OrderId)) {
    lastOrderId = parseInt(value.OrderId);
}
console.log("最後一筆資料ID" + lastOrderId);
解析完成後加入
if (lastOrderIdMax < lastOrderId) {
    lastOrderIdMax = lastOrderId;
    console.log("數字最大的一筆資料ID = " + lastOrderIdMax);
    waveplay();
} else {
    console.log("lastOrderIdMax =  lastOrderId = " + lastOrderIdMax);
}

如此一來可以確保資料一定會是最新的一筆,唯該方是在第一次的時候,一定會判定有最新資料,所以一定會有所提示,但進入頁面後,除非有新資料進來,不然一定不會再次響起提示

Q2. 訂單來的時候改面畫面的文字
A2. 先在頁面中指定一個ID,如下為OrderAlert,並在Javascript中進行判斷後,修改該文字
if (value.Status == "訂單已送出") {
    // console.log("已完成狀態" + value.Status);    changeOrderAlertText("有新訂單");
} else {
    // console.log("未完成狀態" + value.Status);}

/*改變現在狀態文字*/function changeOrderAlertText(surl) {
    document.getElementById("OrderAlert").innerText = surl;
}
亦可用此文字來取得狀態,當有任何新訂單的時候
在"function"外頭先加入(先設定全域變數)
var boolean = false;
然後在Json資料解析的時候加入
if (value.Status == "訂單已送出") {
    boolean = true;
}
if (boolean == true) {
    changeOrderAlertText("有新訂單");
} else {
    changeOrderAlertText("沒有新訂單");
}

Q3. 有新訂單的時候,撥放音效提示(在Javascript中判斷、撥放)
A3. 使用該行程式,並加入判斷if中執行。
/*有最新資料時播放音效*/function waveplay() {
    var audio = new Audio('sound/song.wav');
    audio.play();
}
當初為了播放這個音效,找了很多網頁,但是都是使用在網頁上的,而不是如同本文的使用
Javascript來判斷、播放。該方法可以順利的直接寫在Javascript中,而無須在Html中設定id來執行


Q4. 設定定時更新
A4. 因為如果切換的時候,會有必要進行停止之前的更新,所以要先在Javascript的一開始就先進行全域變數的設定
var re1;
var re2;
var re3;
然後在使用setInterval時,需先命名,然後才進行執行
SearchOrderByStoreM($("#OrderTable"));
re1 = setInterval(function () {
    SearchOrderByStoreM($("#OrderTable"))
}, 60000)
過後當要切換其他檔案時,需先關閉該setInterval才能繼續進行,不然畫面會打架互相搶資料
function startAllOrders() {
    clearInterval(re1);
    clearInterval(re2);
    AllOrders()
    re3 = setInterval(function () {
        AllOrders()
    }, 60000)
}

在一開始測試時,雖然已經設定關閉,但仍然會有畫面互相干擾的問題(沒有關好)
判定應該是因為clearInterval沒有關閉完成就開始進行function的緣故,後來嘗試了幾種方式(包含將clearInterval放入AllOredrs()涵式中,仍然有覆蓋干擾的問題,後來發現將刷新秒數增加到30秒以上的時候,這個問題就不見了(原本測試中是使用5秒)。







留言

這個網誌中的熱門文章

jQuery獲取Select選擇的Text和Value(轉)

Android 在Fragment下控制輸入鍵盤

彈跳視窗iframe的運用