chose-panel.js 1.45 KB
/**
 * 购物车选择尺寸、颜色和数量面板
 * 显示时构造当前商品信息的HTML插入yoho-page;消失则是直接清除HTML
 * @author: xuqi<qi.xu@yoho.cn>
 * @date: 2015/10/21
 */

var $ = require('jquery'),
    Handlebars = require('yoho.handlebars');

var $page = $('.yoho-page');

var $num;

var tpl;

//读取partials
$.ajax({
    type: 'GET',
    url: '/shoppingCart/tpl',
    success: function(data) {
        tpl = Handlebars.compile(data);
    }
});

//显示
function show(data) {
    var html = tpl(data);

    $page.append(html);

    $num = $('#good-num');
}

//移除当前Panel
function remove() {
    $('.chose-panel').remove();
}

$('.yoho-page').on('touchstart', '.chose-panel', function(e) {
    var $cur = $(e.target);

    if ($cur.closest('.main').length > 0) {
        return;
    }

    //点击蒙版消失
    remove();
}).on('touchstart', '#chose-btn-sure', function() {

    //确定
}).on('touchstart', '.block', function() {

    //尺寸颜色点选
    var $this = $(this);

    if ($this.hasClass('.chosed') || $this.hasClass('disable')) {
        return;
    }

    $this.siblings('.chosed').removeClass('chosed');
    $this.addClass('chosed');
}).on('touchstart', '.btn-minus', function() {
    var num = +$num.val();

    if (num === 1) {
        return;
    }

    $num.val(num - 1);
}).on('touchstart', '.btn-plus', function() {
    var num = +$num.val();

    //TODO:库存数验证
    $num.val(num + 1);
});

exports.show = show;