order.page.js 3.95 KB
/**
 * [个人中心]首页/我的订单
 * @author: xuqi<qi.xu@yoho.cn>
 * @date: 2016/07/04
 */

var tableOperation = {
    $header: $('.table.column-category'),
    $body: $('.table.table-body'),
    removeBody: function() {
        this.$body = $('.table.table-body');
    },
    appendBody: function(htmlStr) {
        this.$body.remove();
        $(htmlStr).appendTo(this.$header);
    }
};

var countDown = {
    count: null,
    intervalTimer: null,
    intervalValue: 60000,
    $element: null,
    selector: '.left-time',
    setTime: function() {
        var that = this;

        this.$element.each(function(index, item) {
            var $item = $(item);
            var leftTime = $item.data('left');

            $item.text(that.convertLeftTime(leftTime - that.count * 60));
        });
        this.count += 1;
    },
    convertLeftTime: function(src) {
        var min = parseInt(src / 60, 10) % 60;
        var hour = parseInt(src / 3600, 10);
        var timeStr = min + '分';

        if (src <= 0) {
            timeStr = '已失效';
            return timeStr;
        }

        if (hour > 0) {
            timeStr = hour + '时' + timeStr;
        }

        timeStr = '剩余' + timeStr;

        return timeStr;
    },
    getLeftTime: function() {
        var that = this;

        if (this.$element.length) {
            this.setTime();
            this.intervalTimer = setInterval(this.setTime.bind(that), that.intervalValue);
        }
    },
    start: function() {
        this.count = 0;
        this.$element = $(this.selector);
        if (this.intervalTimer) {
            clearInterval(this.intervalTimer);
        }
        this.getLeftTime();
    }
};

var typeMap = {
    all: 1,
    paying: 2,
    delivering: 3
};

require('./me');

function getOrderList(type, page) {
    tableOperation.removeBody();

    $.ajax({
        url: 'getOrderList',
        data: {
            type: type,
            page: page
        }
    }).done(function(res) {
        tableOperation.appendBody(res);
        bindPaginationClick(); // eslint-disable-line
        countDown.start();
    }).fail(function(err) {
        console.log(err);
    });
}

function getQueryString() {
    var queryArr = location.search.substr(1).split('&');
    var query = {};

    queryArr.forEach(function(pair) {
        var arr = pair.split('=');

        query[arr[0]] = arr[1];

    });

    return query;
}


function bindPaginationClick() {
    $('.blk-pagination li').off('click').on('click', function(e) {
        var $this = $(this);
        var page = $this.find('a').attr('href').split('=')[1];
        var type = getQueryString().type;

        e.preventDefault();

        if (!$this.hasClass('active')) {
            $('.blk-pagination li.active').removeClass('active');
            $this.addClass('active');
            $(window).scrollTop(0);

            getOrderList(type, page);
        }

    });
}

function getOrderTotal(type, key) {
    $.ajax({
        url: 'getOrderTotal',
        data: {
            type: type
        }
    }).done(function(result) {
        var $navItme = $('*[data-type="' + key + '"]');

        if (!$navItme.hasClass('active') && result.total !== 0) {
            $navItme.find('.badge').text(result.total);
        }
    });
}

function setOrderTotal() {
    var key;

    for (key in typeMap) {
        if (key !== 'all') {
            getOrderTotal(typeMap[key], key);
        }
    }
}


$('.tabs li').on('click', function() {
    var $this = $(this);
    var $searchBar = $('.search-bar');


    var type = typeMap[$this.data('type')];
    var page = getQueryString().page;

    if (!$this.hasClass('active')) {
        $('.tabs li.active').removeClass('active');
        $this.addClass('active');
        $this.find('.badge').text('');

        if (type !== 1) {
            $searchBar.addClass('vhide');
        } else {
            $searchBar.removeClass('vhide');
        }

        getOrderList(type, page);
    }

});


bindPaginationClick();
countDown.start();
setOrderTotal();