Django 使用 bootstrap-table插件，表格分頁 + UTC、時間戳 互轉

前端html代碼：

        <div id="queryResult" class="well" style="width: 91%;">
            <table id="order_list"></table>
        </div>

前端js代碼：

// 查詢訂單 請求
$(document).ready(function () {
    $('#queryOrderBtn').click(function () {
        if ( !$('#rechargeStartTime').val() || !$('#rechargeEndTime').val() ) {
            alert('充值時間不能爲空！');

        } else {
            createOrderTable();
        }
    })
});

// 查詢訂單 返回結果 調用bootstrap-table插件
function createOrderTable(params) {
    $('#order_list').bootstrapTable('destroy');  //每次加載前，先銷燬原來的表，相當於“刷新”
     postOrderData = function (params) {
        var temp = {
            // limit: params.limit,   //頁面大小，後端處理分頁時，需要提供
            // offset: params.offset,  //頁碼，後端處理分頁時，需要提供
            "zoneID": $('#zoneID').val(),
            "channelID": $('#channelID').val(),
            "payType": $('#payType').val()
        };
        return temp;
    };

    $('#order_list').bootstrapTable({
        url: '/queryOrder',
        method: 'post',
        contentType:"application/x-www-form-urlencoded; charset=UTF-8", // 默認是：'application/json'， 不改的話，後臺獲取不到數據！ ###### 非常重要！！######
        queryParams: postOrderData,   //查詢參數
        cache: false,   //是否啓用 數據緩存
        pagination: true,  //是都分頁
        sidePageination: 'client',   //誰來分頁，客戶端：'client'，服務端：'server'
        pageNumber: 1,   //默認顯示 首頁
            pageSize: 20,     //每頁需要顯示的數據量
        pageList: [10, 25, 50],  //可供選擇的，每頁需要顯示的數據量
        height: 420,       //表格高度
        uniqueId: 'gameorderid',
        silent: true,    // 刷新服務器數據
        showExport: true,
        exportDataType: 'all',
        // rowStyle: function (row, index) {    //自定義行樣式，但是權重 < columns裏的樣式，貌似也不支持 cellStyle方法
        //     if (index == $('#order_sum').bootstrapTable('getData').length-1) {
        //         return {
        //             css: {
        //                 "color": "red",
        //                 "text-align": "center"
        //             }
        //         };
        //     }
        //     return {};
        // },
        columns: [{
            field: 'gameorderid',
            title: '遊戲訂單號',
            valign: 'middle',
            align: 'left',
            halign: 'center'
        }, {
            field: 'orderid',
            title: '渠道訂單號',
            valign: 'middle',
            align: 'left',
            halign: 'center'
        }, {
            field: 'RegisterTime',
            title: '註冊時間',
            valign: 'middle',
            align: 'left',
            halign: 'center'
        }, {
            field: 'AccountId',    //前後端 該字段必須一致！否則，後端傳回來的數據，前端無法識別！
            title: '玩家ID',
            valign: 'middle',
            align: 'left',
            halign: 'center'
        }],
        // data: [
        //     {"AccountId":222},
        // ]
        responseHandler: function(res) {   //處理 從後端 返回的數據
            console.log(res);
            if (res == 0) {
                alert('查詢出問題！');
            } else {
                var orderListData = res['rows'];  //##### 重要！！#####
                return orderListData;
            }
        },
        onLoadError: function (status) {
            console.log(status);
            $('#order_list').bootstrapTable('removeAll');
        }
    })
}

後端python代碼：

def query_order(request):
    data = request.POST   # 獲取 bootstrap-table post請求的數據，直接POST獲取！
    queryResult = db_queryOrder(data)   #去數據庫查詢
    if queryResult == 0:
        return HttpResponse('0')

    elif queryResult == -1:
        return HttpResponse('-1')

    else:
        '''服務端分頁時，前端需要傳回：limit（每頁需要顯示的數據量），offset（分頁時 數據的偏移量，即第幾頁）'''
        '''mysql 利用 limit語法 進行分頁查詢'''
        '''服務端分頁時，需要返回：total（數據總量），rows（每行數據）  如： {"total": total, "rows": []}'''
        returnData = {"rows": []}  #########非常重要############
        with open("slg/others/country", "r") as f:
            datas = json.loads(f.read())  # 直接讀出來，是dic對象，用key，value獲取。。。上面的是轉換爲 對象了，可以用 “.” 獲取
        '''遍歷 查詢結果集'''
        for results in queryResult:
            '''遍歷 country.json 輸出 訂單狀態'''
            for data in datas['order']:
                if data['stateNum'] == str(results['purchasestate']):
                    orderStateResult = data['stateResult']

            '''遍歷 country.json 輸出 國家名稱'''
            for data in datas['country']:
                if data['shorthand'] == results['countrycode']:
                    countryName = data['name']

            returnData['rows'].append({
                "gameorderid": results['gameorderid'],
                "orderid": results['orderid'],
                "nickname": results['nickname'],
                "gameName": "Wrath",
                "PurchaseTimes": results['purchasetimes'],
                "PriceAmount": str(results['priceamount']),
                "PurchaseState": orderStateResult,
                "PurchaseTime": time.strftime("%Y-%m-%d %H:%M:%S %Z", time.gmtime(results['purchasetime'])),  #將 時間戳 轉換爲 UTC時間
                "AccountId": results['accountid'],
                "CountryCode": countryName
            })
        #最後用dumps包裝下，json.dumps({"rows": [{"gameorderid": 1}, {"gameorderid": 22}]})
        return HttpResponse(json.dumps(returnData))

後端python 查詢數據庫：

from . import db_models as db
import time
import traceback

# 查詢訂單
def db_queryOrder(data):
    ''' 充值時間 '''
    rechargeStartTime = toTimeStamp(data['rechargeStartTime'])
    rechargeEndTime = toTimeStamp(data['rechargeEndTime'])
    result = db.TbBills.objects.filter(purchasetime__gte=rechargeStartTime, purchasetime__lte=rechargeEndTime).values()    #### 一定要獲取它的 Fields 數據！#####
    ''' 區服 '''
    if data['zoneID']:
        result = result.filter(zoneid=data['zoneID'])
    ''' 充值金額 '''
    if data['rechargeStartMoney'] and data['rechargeEndMoney']:
        result = result.filter(priceamount__gte=rechargeStartMoney, priceamount__lte=rechargeEndMoney)

    try:

        if result.count() == 0:
            return 0

        else:
            return result

    except BaseException:
        print(traceback.format_exc())
        return -1



# 格式化時間（UTC） --> struct_time(時間元祖) --> 時間戳 轉換方法
def toTimeStamp(times):
    structTime = time.strptime(times, "%Y-%m-%d %H:%M:%S")
    timeStramp = time.mktime(structTime)
    return timeStramp

json文件：

{
  "order": [
    {"stateNum": "-1", "stateResult": "已創建"},
    {"stateNum": "0", "stateResult": "成功"}
  ],
  "country": [
    {"name":"阿富汗","shorthand":"AF"},
    {"name":"阿爾巴尼亞","shorthand":"AL"}
  ]
}