user.page.js 8.38 KB
/**
 * 个人中心页-个人资料编辑
 * @author: zhaobiao<bill.zhao@yoho.cn>
 * @date: 2016/02/17
 */
var $ = require('yoho-jquery');

var $allEditForms = $('.userinfo-edit form, #Y_bindAccount .account-list');

var address = require('../common/common-address');

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

var $brands = $('#brand-box li'),
    $province = $('#province').val();

var date = {
    init: function() {
        var $year = $('#year'),
            $month = $('#month'),
            $day = $('#day');

        var that = this;

        this.createDay($year.val(), $month.val(), $day.val());

        $year.on('change', function() {
            that.update();
        });

        $month.on('change', function() {
            that.update();
        });
    },
    update: function() {
        this.createDay($('#year').val(), $('#month').val(), $('#day').val());
    },
    createDay: function(year, month, day) {
        var html = '<select name="day" id="day">',
            monthArray = [4, 6, 9, 11],
            dayNum = 31;

        var select,
            i;

        year = parseInt(year, 10);
        month = parseInt(month, 10);

        if (year === 0) {
            year = 0;
        }

        if (month === 0) {
            month = 0;
        }

        $('#year').val(year.toString());
        $('#month').val(month.toString());

        html += '<option value="0">日</option>';

        if (year > 0 && month > 0) {
            if ($.inArray(month, monthArray) !== -1) {
                dayNum = 30;
            } else if (month === 2) {
                dayNum = 28;
                if ((year % 4) === 0 && (year % 100 !== 0 || year % 400 === 0)) {
                    dayNum = 29;
                }
            }

            for (i = 1; i <= dayNum; i++) {
                select = '';

                if (parseInt(day, 10) === i) {
                    select = 'selected';
                }
                html += '<option value="' + i + '" ' + select + '>' + i	+ '</option>';
            }
        }
        html += '</select>';

        $('#day').replaceWith(html);
    }
};

require('../common');

$('.userinfo-edit h2').on('click', function() {
    var $form = $(this).next();

    $allEditForms.slideUp('fast');
    $form.css('display') === 'none' ? $form.slideDown('slow') : null;

});

function checkBaseForm() {
    var nicknameLength = $('#nickname').val().length,
        usernameLength = $('#username').val().length,
        $gender = $('input[name="gender"]'),
        $year = $('#year'),
        $month = $('#month'),
        $day = $('#day');

    if (nicknameLength === 0) {
        new Alert('请输入昵称').show();
        return false;
    }

    if (usernameLength === 0) {
        new Alert('请输入用户名').show();
        return false;
    }

    if (nicknameLength >= 20) {
        new Alert('昵称最长为20个字符').show();
        return false;
    }


    if (!$gender.is(':checked')) {
        new Alert('请选择性别').show();
        return false;
    }

    if ($year.val() === '0' || $month.val() === '0' || $day.val() === '0') {
        new Alert('请选择出生年月日').show();
        return false;
    }

    return true;
}

function checkContactForm() {
    if ($('#province').val() === '0' || $('#city').val() === '0' || $('#areaCode').val() === '0') {
        new Alert('请选择所在区域').show();
        return false;
    }

    if ($('#province').val() === null || $('#city').val() === null || $('#areaCode').val() === null) {
        new Alert('请选择所在区域').show();
        return false;
    }

    if ($('#phone').val().length === 0 && $('#mobile').val().length === 0) {
        new Alert('电话和手机号码不能同时为空,请填写!').show();
        return false;
    }


    if ($('#fullAddress').val().length === 0) {
        new Alert('请填写地址').show();
        return false;
    }

    if ($('#zipCode').val().length === 0 || $('#zipCode').val().length < 2) {
        new Alert('请填写邮编').show();
        return false;
    }

    return true;
}

function checkHabbitForm() {
    if (!$('.user-habbit-info input').is(':checked')) {
        new Alert('请填写购物&着装习惯').show();
        return false;
    }

    return true;
}

function checkFavoriteForm() {
    if ($('#likebrand').val() === '') {
        new Alert('请选择品牌').show();
        return false;
    }

    return true;
}

function delBrand(brandId) {
    var brand = $('#likebrand').val();

    if (parseInt(brandId, 10) === 0) {
        return false;
    }

    $('#likebrand').val(brand.replace(',' + brandId + ',', ','));
    $('#pp-' + brandId).attr('checked', false);
    $('#brand-' + brandId).remove();
}



function addBrand(domObj, brandId, brandName) {
    var html = '<li id="brand-' + brandId + '">' +
                brandName + '<a href="javascript:void(0);" class="btn-del"></a></li>';

    var brandInfo = $('#brand-' + brandId).html(),
        brandStr = $('#likebrand').val();

    var $brandBox = $('#brand-box');

    if (parseInt(brandId, 10) === 0) {
        return false;
    }

    if (typeof domObj !== 'undefined' && domObj !== '' && domObj.checked === false) {
        delBrand(brandId);
        return false;
    }
    if (brandInfo) {
        new Alert('您已经选择了该品牌.').show();
        return false;
    }
    $brandBox.append(html);

    $brandBox.find('li>a').off('click').on('click', function() {
        delBrand($(this).closest('li').attr('id').substr(6));
    });

    brandStr += brandId + ',';
    $('#likebrand').val(brandStr);
}

function checkBrand() {
    var postData = {
        brandName: $('#keywords').val()
    };

    $.post('/home/user/isbrandname', postData, function(data) {
        if (data.code === 200) {
            if (data.data.id && data.data.brand_name) {
                addBrand('', data.data.id, data.data.brand_name);
                $('#keywords').val('');
                return true;
            } else {
                new Alert('网络异常,请重试').show();
                return false;
            }
        }
        new Alert(data.message).show();
        return false;
    }, 'json');
}

function save(postUrl, btnId) {
    var $form = $('#' + btnId).closest('form');

    $.post(postUrl, $form.serialize(), function(data) {
        if (data.code === 200) {
            new Alert(data.message).show();
            setTimeout(function() {
                $form.closest('div').next().find('h2').click();
            }, 100);
            return true;
        }
        new Alert(data.message).show();
        return false;
    }, 'json');
}


$('#base-info').on('click', function() {
    if (checkBaseForm()) {
        save('/home/user/edituserinfo/', 'base-info');
    }
});

$('#contact-info').on('click', function() {
    if (checkContactForm()) {
        save('/home/user/editusercontactinfo/', 'contact-info');
    }
});

$('#shopping-info').on('click', function() {
    if (checkHabbitForm()) {
        save('/home/user/edituserhabitsinfo/', 'shopping-info');
    }
});

$('#favorite-brand').on('click', function() {
    if (checkFavoriteForm()) {
        $.ajax({
            url: '/home/user/edituserlikebrand/',
            type: 'post',
            datatype: 'json',
            data: {
                brand: $('#likebrand').val()
            },
            success: function(data) {
                if (data.code === 200) {
                    new Alert(data.message).show();
                    return true;
                }
                new Alert(data.message).show();
                return false;
            },
            error: function() {
                new Alert('网络异常').show();
            }
        });
    }
});

$('#add-brand-btn').on('click', function() {
    checkBrand();
});

$('.user-favorite-info input[type="checkbox"]').on('click', function() {
    var $this = $(this);

    addBrand(this, $this.attr('id').substr(3), $this.parent().text());
});

(function() {
    if ($brands.length > 0) {
        $brands.find('a').on('click', function() {
            delBrand($(this).closest('li').attr('id').substr(6));
        });
    }

    if (!$province) {
        address.loadAllData(0, {
            provinceDomId: 'province',
            cityDomId: 'city',
            areaDomId: 'areaCode'
        });
    } else {
        address.bindAreaChange({
            provinceDomId: 'province',
            cityDomId: 'city',
            areaDomId: 'areaCode'
        });
    }
}());

date.init();

require('./3party-bind');