yeoman下做party_bid第三張卡總結

第三張卡主要是對競價報名和競價短信的處理

1  建立一個新的競價

在為某一個活動建立競價的時候，要實作各個活動的競價的分離

方法：在儲存某一個活動的競價的時候，先從競價清單裡找到屬于該活動的競價暫存到一個數組中，然後在儲存競價名字的時候，定義競價的名字等于這個數組的長度+1，這樣就可以将各個活動的競價分離開

執行個體：

var bid_name = "競價" + (Bid。current_bid_lists().length + 1);

Bid.current_bid_lists = function () {
    return _.filter(Bid.get_bid(), function (bid_list) {
        return bid_list.activity == localStorage.current_activity;
    })
}/*周遊數組中的每一個元素，從中找到屬于目前活動的競價并傳回*/      

2   判斷競價的短信JJ後面是否為數字

方法：我在做的時候是先将JJ後面的内容提取出來，然後轉換為ASCII碼，再判斷是數字還是字母，根據傳回的布爾值判斷是字母還是數字。

BidMessage.judge_number = function (json_message) {
    var price = json_message.messages[0].message.substr(2).replace(/\s/g, '');/*提取JJ後面的内容*/
   for (var i = 0; i < price.length; i += 1) {
       var chr = price.charAt(i);//
       if (chr < 48 || chr > 57) {
            return true;
        } else {
            return false;
       }
    }
}
      

3   統計目前活動目前競價的報名人數

方法：我在做的時候先從本地資料庫中競價短信的數組裡找到報名目前活動的目前競價，放到一個數組中，這個數組的長度即為報名目前活動的目前競價的人數

執行個體：

BidMessage.search_current = function () {
    return _.filter(BidMessage.get(), function (bid_message) {
        return bid_message.activity == localStorage.current_activity && bid_message.bid == localStorage.current_bid;
    })
}
var counter=BidMessage.search_current().length;
counter即為報名目前所在頁面的人數 
      

4   實作競價報名頁面的實時顯示

方法：在model裡面寫一個重新整理函數，報名成功後調用這個函數，在頁面對應的JS裡面寫上頁面要及時重新整理的内容，即可實作頁面的實時顯示功能

執行個體：

model裡
BidMessage.refresh_bid_sign = function () {
    var id_exist = document.getElementById("refresh_bid_sign"/*這是給頁面綁定的ID*/)
    if (id_exist) {
        var scope = angular.element(id_exist).scope();
        scope.$apply(function () {
            scope.refresh();
        })
    }
}/*這個函數是在報名成功後調用的*/

在頁面對應的js裡：
 $scope.refresh = function () {
            $scope.currents = BidMessage.search_current();/*實時顯示報名資訊*/
            $scope.counter = BidMessage.search_current().length;/*統計競價人數的重新整理*/
        }
        $scope.refresh();      

5   競價報名頁面開始按鈕的四種狀态

競價報名頁面的開始按鈕需要設定四種狀态，開始、結束、不可點的開始和不可點的結束，當一個競價的狀态為結束的時候顯示為不可點選的結束按鈕，當該競價的狀态為開始的時候顯示為結束按鈕，當該競價的狀态為還未開始的狀态時，如果沒有其他競價在進行顯示為可以點選的開始按鈕，如果有其他競價在進行，顯示為不可點選的開始按鈕。

方法：用ng-switch來實作四種按鈕的顯示，給ng-switch定義一個變量，設定該變量為四個不同的值時顯示四種不同的按鈕。

執行個體：

在haml裡用ng-swich
.header-right(ng-switch='which_button')
  %button.btn-4(ng-switch-when='start')開始
  %button.btn.btn-4(ng-switch-when='un_click_start' ng-disabled='disabled_start')開始
  %button.btn-4(ng-switch-when='end')結束
  %button.btn.btn-4(ng-switch-when='un_click_end' ng-disabled='disabled_end')結束      

在js裡寫的時候，which_button="start"的時候顯示可以點的開始按鈕，which_button=“un_click_start”時顯示不可點選的開始按鈕，which_button=“end”時顯示可以點選的結束按鈕，which_button=“un_click_end”時顯示不可點選的結束按鈕。