orderdetail.page.js 10.6 KB
/**
 * 订单详情页
 * @author: xuqi<qi.xu@yoho.cn>
 * @date: 2015/11/16
 */

var $ = require('yoho-jquery'),
    lazyLoad = require('yoho-jquery-lazyload'),
    Hammer = require('yoho-hammer'),
    dialog = require('../plugin/dialog'),
    tip = require('../plugin/tip'),
    Swiper = require('yoho-swiper');

var orderId = $('#order-detail').data('id'),
    $countDownHours = $('.hours'),
    $countdownContainer = $('.count-down'),
    $ownerInfo = $('.owner-info'),
    $reaMask = $('.reason-mask'),
    $refundReaMask = $('.refund-reason-mask'),
    reasonSwiper,
    refundReasonSwiper,
    optHammer,
    $createTime = new Date($('.createTime').text() * 1000);

var $sureClose = $('#sureClose'); // 确定删除订单
var $sureRefund = $('#sureRefund'); // 确定申请退款
var $disMissBtn = $('.dis-miss-btn'); // 返回


require('home/order-detail-index.page.css');
require('../common');
require('../plugin/modal.alert');
require('../../scss/layout/_modal.css');

lazyLoad({
    try_again_css: 'order-failure'
});

function downCount(options) {

    var difference = options, // difference of dates
        interval;

    /**
     * Main downCount function that calculates everything
     */
    function countdown() {

        // basic math variables
        var _second = 1000,
            _minute = _second * 60,
            _hour = _minute * 60,
            _day = _hour * 24,
            hours,
            minutes,
            seconds;

        // calculate dates
        hours = Math.floor((difference % _day) / _hour);
        minutes = Math.floor((difference % _hour) / _minute);
        seconds = Math.floor((difference % _minute) / _second);

        // fix dates so that it will show two digets
        hours = (String(hours).length >= 2) ? hours : '0' + hours;
        minutes = (String(minutes).length >= 2) ? minutes : '0' + minutes;
        seconds = (String(seconds).length >= 2) ? seconds : '0' + seconds;

        // set to DOM
        $countdownContainer.removeClass('hide');
        if (hours === '00') {
            $countDownHours.text('剩余' + minutes + ':' + seconds);
        } else {
            $countDownHours.text('剩余' + hours + ':' + minutes + ':' + seconds);
        }

        difference -= 1000;

        if (difference < 0) {
            clearInterval(interval);// stop timer
            return;
        }
    }
    if (difference !== '' && difference > 0) {
        interval = setInterval(countdown, 1000);// start
    }
}

downCount($countDownHours.text());

// 订单删除
optHammer = new Hammer(document.getElementsByClassName('opt')[0]);
optHammer.on('tap', function(e) {
    var $cur = $(e.target);

    if ($cur.hasClass('btn-del')) {

        // 删除订单
        dialog.showDialog({
            dialogText: '确定删除订单吗?',
            hasFooter: {
                leftBtnText: '取消',
                rightBtnText: '确定'
            }
        }, function() {
            $.ajax({
                type: 'GET',
                url: '/home/delOrder',
                data: {
                    id: orderId
                }
            }).then(function(res) {
                $('#dialog-wrapper').hide();
                if ($.type(res) !== 'object') {
                    return;
                }
                if (res.message) {
                    tip.show(res.message);
                }
                setTimeout(function() {
                    window.location.href = '/home/orders';
                }, 2000);
            }).fail(function() {
                tip.show('网络错误');
            });
        });
    } else if ($cur.hasClass('btn-cancel')) {
        // $reaMask.css('visibility', 'visible');
    } else if ($cur.hasClass('btn-refund')) {
        // $refundReaMask.css('visibility', 'visible');

         /**
         * 埋点
         */
        if (window._yas && window._yas.sendCustomInfo) {
            window._yas.sendCustomInfo({
                op: 'YB_ORDER_REFUND_C',
                param: JSON.stringify({
                    C_ID: window._ChannelVary[window.cookie('_Channel')],
                    ORD_NUM: orderId
                })
            }, true);
        }
    } else if ($cur.hasClass('btn-rebuy')) {
        $.ajax({
            type: 'GET',
            url: '/home/readd',
            data: {
                orderCode: orderId
            },
            success: function(res) {
                tip.show(res.message);
                location.href = '/cart/index/index';
            },
            error: function(res) {
                tip.show(res.message);
            }
        });
    }
});

if ($ownerInfo.data('changeable') === true) {
    $ownerInfo.find('.rest').show();
    $ownerInfo.on('touchend', function() {
         /**
         * 埋点
         */
        if (window._yas && window._yas.sendCustomInfo) {
            window._yas.sendCustomInfo({
                op: 'YB_ORDER_MODIFY_ADDRESS_C',
                param: JSON.stringify({
                    C_ID: window._ChannelVary[window.cookie('_Channel')],
                    ORD_NUM: orderId
                })
            }, true);
        }

        location.href = $ownerInfo.data('url');
    });
}

$(function() {
    reasonSwiper = new Swiper('.box-main', {
        initialSlide: 0,
        centeredSlides: true,
        slidesPerView: 5,
        direction: 'vertical',
        onSlideChangeStart: function(reasonSwiper) {//eslint-disable-line
            var activeIndex = reasonSwiper.activeIndex,
                slides = reasonSwiper.slides,
                i = 0;

            if (slides.length !== 1) {
                if (activeIndex === 0) {
                    for (i = 1; i < slides.length; i++) {
                        $(slides[i]).css('transform', '');
                    }
                } else if (activeIndex === slides.length - 1) {
                    for (i = 0; i < activeIndex; i++) {
                        $(slides[i]).css('transform', 'rotateX(' + (30 + (activeIndex - i) * 12) + 'deg)');
                    }
                } else {
                    for (i = 0; i < activeIndex; i++) {
                        $(slides[i]).css('transform', 'rotateX(' + (30 + (activeIndex - i) * 12) + 'deg)');
                    }
                    for (i = activeIndex + 1; i < slides.length; i++) {
                        $(slides[i]).css('transform', '');
                    }
                }
            }
            $(slides[activeIndex]).css('transform', '');
        }
    });

    // 申请退款 Swiper
    refundReasonSwiper = new Swiper('.refund-box-main', {
        direction: 'vertical',
        slidesPerView: 5,
        centeredSlides: true,
        initialSlide: 0,
        onSlideChangeStart: function(refundReasonSwiper) {//eslint-disable-line
            let activeIndex = refundReasonSwiper.activeIndex,
                slides = refundReasonSwiper.slides,
                i = 0;

            if (slides.length !== 1) {
                if (activeIndex === 0) {
                    for (i = 1; i < slides.length; i++) {
                        $(slides[i]).css('transform', '');
                    }
                } else if (activeIndex === slides.length - 1) {
                    for (i = 0; i < activeIndex; i++) {
                        $(slides[i]).css('transform', 'rotateX(' + (30 + (activeIndex - i) * 12) + 'deg)');
                    }
                } else {
                    for (i = 0; i < activeIndex; i++) {
                        $(slides[i]).css('transform', 'rotateX(' + (30 + (activeIndex - i) * 12) + 'deg)');
                    }
                    for (i = activeIndex + 1; i < slides.length; i++) {
                        $(slides[i]).css('transform', '');
                    }
                }
            }
            $(slides[activeIndex]).css('transform', '');
        }
    });
});

/**
 * 取消订单
 */
$reaMask.find('.box-cmp').on('touchend', function() {
    var selSolid = reasonSwiper.slides[reasonSwiper.activeIndex],
        reason = $(selSolid).text(),
        reasonId = $(selSolid).data('reasonId');

    $.ajax({
        type: 'GET',
        url: '/home/cancelOrder',
        data: {
            id: orderId,
            reason: reason,
            reasonId: reasonId
        }
    }).then(function(res) {
        $reaMask.fadeOut();
        if ($.type(res) !== 'object') {
            return;
        }
        if (res.message) {
            tip.show(res.message);
        }
        setTimeout(function() {
            window.location.href = '/home/orders';
        }, 2000);
    }).fail(function() {
        tip.show('网络错误');
    });
});

// 申请退款
$refundReaMask.find('.box-cmp').on('touchend', function() {
    let selSolid = refundReasonSwiper.slides[refundReasonSwiper.activeIndex],
        reason = $(selSolid).text(),
        reasonId = $(selSolid).data('reasonId');

    $.ajax({
        type: 'GET',
        url: '/home/refundApply',
        data: {
            id: orderId,
            reason: reason,
            reasonId: reasonId
        }
    }).then(function(res) {
        $refundReaMask.fadeOut();
        if ($.type(res) !== 'object') {
            return;
        }
        if (res.message) {
            tip.show(res.message);
        }
        setTimeout(function() {
            window.location.href = '/home/orders';
        }, 2000);
    }).fail(function() {
        tip.show('网络错误');
    });
});

$reaMask.on('touchend', function(event) {
    if (event.target.className !== 'reason-mask') {
        return false;
    }

    $reaMask.css('visibility', 'hidden');
    event.stopPropagation();
});

// 申请退款
$refundReaMask.on('touchend', function(event) {
    if (event.target.className !== 'refund-reason-mask') {
        return false;
    }

    $refundReaMask.css('visibility', 'hidden');
    event.stopPropagation();
});


// 弹出取消订单提示框
$sureClose.on('click', function() {
    $disMissBtn.trigger('click');
    $reaMask.css('visibility', 'visible');
});

// 弹出申请退款提示框
$sureRefund.on('click', function() {
    $disMissBtn.trigger('click');
    $refundReaMask.css('visibility', 'visible');
});

function formatDate(objD) {
    var str,
        yy = objD.getYear(),
        MM = objD.getMonth() + 1,
        dd = objD.getDate(),
        hh = objD.getHours(),
        mm = objD.getMinutes(),
        ss = objD.getSeconds();

    if (yy < 1900) {
        yy = yy + 1900;
    }

    if (MM < 10) {
        MM = '0' + MM;
    }

    if (dd < 10) {
        dd = '0' + dd;
    }

    if (hh < 10) {
        hh = '0' + hh;
    }

    if (mm < 10) {
        mm = '0' + mm;
    }

    if (ss < 10) {
        ss = '0' + ss;
    }

    str = yy + '-' + MM + '-' + dd + ' ' + hh + ':' + mm + ':' + ss;
    $('.createTime').text(str);
}

formatDate($createTime);