invoice.js 5.86 KB
/**
 * 订单结算页-发票
 * @author: yyq<yanqing.yang@yoho.cn>
 * @date: 2016/12/29
 */

var $ = require('yoho-jquery');

var Dialog = require('../../common/dialog').Dialog;

var $invoiceRadio = $('#invoice-radio');

var invoiceTpl = $('#invoice-chose-tpl').html();

var invoiceInfo = {};

function validateInvoice($el, info) {
    var pass = true;
    var $receiverTip;

    // 发票抬头
    if (!info.titleName) {
        pass = false;
        $('.invoice-title-tip', $el).removeClass('hide');
    } else {
        $('.invoice-title-tip', $el).addClass('hide');
    }

    // 收票人手机号
    if (info.invocesType * 1 === 2) {
        $receiverTip = $('.receiver-tip', $el);

        if (!info.receiver) {
            $receiverTip.removeClass('hide').find('em').html('请填写手机号码');
            pass = false;
        } else if (!/^[0-9]{11}$/.test(info.receiver)) {
            $receiverTip.removeClass('hide').find('em').html('手机号码不正确');
            pass = false;
        } else {
            $receiverTip.addClass('hide');
        }
    }

    return pass;
}

function bindInvoiceEvent($el) {
    var $invoiceTypeWrap = $('.invoice-type', $el),
        $titleWrap = $('.invoice-title', $el),
        $goodsTypeWrap = $('.invoice-goods-type', $el),
        $receiver = $('.receiver', $el),
        $companyRow = $('.company-row', $el);

    $invoiceTypeWrap.on('click', 'li', function() {
        var $this = $(this);

        if ($this.hasClass('focus')) {
            return;
        }

        if ($this.hasClass('el-invoice')) {
            $receiver.removeClass('hide');
        } else {
            $receiver.addClass('hide');
        }

        $this.siblings('.focus').removeClass('focus');
        $this.addClass('focus');
    });

    $titleWrap.on('click', '.radio-btn', function() {
        var $this = $(this),
            id = $this.data('id');

        if ($this.hasClass('on')) {
            return;
        }

        if (id * 1 === 2) {
            $companyRow.removeClass('hide');
        } else {
            $companyRow.addClass('hide');
        }

        $titleWrap.find('.on').removeClass('on');
        $this.addClass('on');
    });

    $goodsTypeWrap.on('click', '.radio-btn', function() {
        var $this = $(this);

        if ($this.hasClass('on')) {
            return;
        }

        $goodsTypeWrap.find('.on').removeClass('on');
        $this.addClass('on');
    });
}

function bindInvoiceInfo($el, info) {
    info = info || {};

    // 发票类型
    if (info.invocesType === 1) {
        $('.pa-invoice', $el).trigger('click');
    }

    if (info.titleId) {
        $('.rbt-' + info.titleId).trigger('click');

        if (info.titleId === 2 && info.titleName) {
            $('#company-name', $el).val(info.titleName);
        }
    }

    if (info.contentId) {
        $('.rbc-' + info.contentId, $el).trigger('click');
    }

    $('#receiver-phone', $el).val(info.receiver || '');
}

function packInvoiceInfo($el) {
    var $goodsType = $('.invoice-goods-type .on', $el);
    var resData = {},
        receiver = $('#receiver-phone', $el).val();

    if ($('.pa-invoice', $el).hasClass('focus')) {
        resData.invocesType = 1;
    } else {
        resData.invocesType = 2;
    }

    resData.titleId = $('.invoice-title .on', $el).data('id') || 1;

    if (resData.titleId * 1 === 1) {
        resData.titleName = '个人';
    } else {
        resData.titleName = $('#company-name', $el).val();
    }

    resData.contentId = $goodsType.data('id');
    resData.contentName = $goodsType.data('name');

    if (receiver) {
        resData.receiver = receiver;
    }

    return resData;
}

function setShowInvoiceInfo() {
    var $dom = $invoiceRadio.next();
    var _h = '';

    if (!invoiceInfo.invocesType) {
        $dom.addClass('hide');
        return;
    }

    if (invoiceInfo.invocesType * 1 === 1) {
        _h += '纸质发票';
    } else {
        _h += '电子发票';
    }

    _h += '&nbsp;&nbsp;&nbsp;&nbsp;' + invoiceInfo.titleName +
        '&nbsp;&nbsp;&nbsp;&nbsp;' + invoiceInfo.contentName;

    $dom.removeClass('hide').find('span').html(_h);
}

function invoiceEditDialog(baseInfo) {
    var invoice = new Dialog({
        content: invoiceTpl,
        className: 'ensure-invoice-dialog',
        btns: [
            {
                id: 'save-invoice',
                name: '保存发票信息',
                btnClass: ['save-invoice'],
                cb: function() {
                    var info = packInvoiceInfo(invoice.$el);

                    if (validateInvoice(invoice.$el, info)) {
                        $.extend(invoiceInfo, packInvoiceInfo(invoice.$el));
                        setShowInvoiceInfo();
                        invoice.close();
                    }
                }
            },
            {
                id: 'cancel-invoice',
                name: '取消',
                btnClass: ['btn-close'],
                cb: function() {
                    invoice.close();
                    if (!invoiceInfo.invocesType) {
                        $invoiceRadio.removeClass('on');
                    }
                }
            }
        ]
    });

    bindInvoiceEvent(invoice.$el);
    bindInvoiceInfo(invoice.$el, baseInfo);

    return invoice;
}

$invoiceRadio.click(function() {
    $invoiceRadio.toggleClass('on');

    if ($invoiceRadio.hasClass('on')) {
        invoiceEditDialog(invoiceInfo).show();
    } else {
        invoiceInfo = {};
        setShowInvoiceInfo();
    }
});

$('#modify-invoice').click(function() {
    invoiceEditDialog(invoiceInfo).show();
});


// 获取发票信息
exports.getInvoice = function() {
    if (!$invoiceRadio.hasClass('on') || !invoiceInfo.invocesType) {
        return;
    }

    return {
        invoicesType: invoiceInfo.invocesType,
        invoicesTitle: invoiceInfo.titleName,
        invoicesContent: invoiceInfo.contentId,
        receiver: invoiceInfo.receiver
    };
};