comment.page.js 6.28 KB
/**
 * 我的评论
 * @author: liuchuanyang<chuanyang.liu@yoho.cn>
 * @date: 2016/10/28
 */
var $ = require('yoho-jquery'),
    ImgPreview = require('../common/img-preview');

var preview = new ImgPreview(); /* ,
    Handlebars = require('yoho-handlebars'),
    itemTpl = Handlebars.compile($('#comment-list-item-tpl').html() || '');*/

var trim = function(str) {
    if (str) {
        str = str.replace(/(^\s*)|(\s*$)/g, '');
    }

    return str;
};

var resetImg = function($p) {
    $p.removeClass('selected');
    $p.find('input[name=imgUrl]').val('');
    $p.find('img').attr('src', '');
};

/* var resetForm = function($f) {
    $f.find('input[name=height]').val('');
    $f.find('input[name=weight]').val('');
    $f.find('[name=goodsComment]').val('');
    $f.find('[data-role="star"] [data-star]').removeClass('active');
    $f.find('[data-role="size"] [data-size]').removeClass('active');

    resetImg($f.find('.img-preview'));
};*/

require('../common');
require('../common/ajaxfileupload');

$('.comment-add').on('click', '.btn-submit', function() {

    var $t = $(this);
    var $f = $t.closest('.comment-add');

    // var id = $t.attr('data-iid');
    // var $list = $('[data-role=commentList][data-lid=' + id + ']');
    var param = {
        productSkn: $f.find('input[name=productSkn]').val(),
        productId: $f.find('input[name=productId]').val(),
        goodsId: $f.find('input[name=goodsId]').val(),
        orderCode: $f.find('input[name=orderCode]').val(),
        orderId: $f.find('input[name=orderId]').val(),
        erpSkuId: $f.find('input[name=erpSkuId]').val(),
        content: $f.find('[name=goodsComment]').val(),
        url: $f.find('[name=imgUrl]').val(),

        height: trim($f.find('input[name=height]').val()),
        weight: trim($f.find('input[name=weight]').val()),
        satisfied: $f.find('[data-role="star"]').find('.active[data-star]').attr('data-star'),
        size: $f.find('[data-role="size"]').find('.active[data-size]').attr('data-size')
    };

    // var itemH;

    if (!param.satisfied) {
        alert('请选择商品满意度!'); // eslint-disable-line
        return;
    }

    if (!param.size) {
        alert('请选择尺码符合度!'); // eslint-disable-line
        return;
    }

    if (param.content && param.content.length > 200) {
        alert('内容超过限定字数!'); // eslint-disable-line
        return;
    }

    if (param.height && !/^\d{0,3}$/.test(param.height)) {
        alert('身高必须为最大3位数的数字'); // eslint-disable-line
        return;
    }

    if (param.weight && !/^\d{0,3}$/.test(param.weight)) {
        alert('体重必须为最大3位数的数字'); // eslint-disable-line
        return;
    }

    $f.closest('[data-role=commentAddForm]').hide();

    $.ajax({
        type: 'POST',
        url: '/home/comment/saveComment',
        data: param
    }).done(function(jsonData) {

        if (jsonData.code === 200) {
            /* itemH = itemTpl($.extend({}, param, jsonData.comment));

            $list.find('td[data-role=clist]').prepend(itemH);
            $list.show();

            resetForm($f);*/
            alert('提交成功'); // eslint-disable-line
            window.location.reload();
        } else {
            alert(jsonData.message); // eslint-disable-line
        }
    }).fail(function(jqXhr, status, err) {
        var msg = (err && err.message) || '上传失败,请稍后再试!';

        alert(msg); // eslint-disable-line
    });
});

// 图片预览
$('.comment-table').on('click', '.img-preview i.view', function(e) {

    var $img = $(this).closest('.img-preview').find('img');
    var url = $img.attr('source-url') || $img.attr('src');

    e.stopPropagation();
    preview.preview(url);
});

// 图片删除
$('.comment-table').on('click', '.img-preview i.del', function(e) {

    var $p = $(this).closest('.img-preview');

    e.stopPropagation();
    resetImg($p);
});

// 图片上传
$('.comment-add').on('change', 'input[type=file]', function() {

    var $f = $(this);
    var $p = $f.closest('.img-preview');

    if ($f.val()) {
        $.ajaxFileUpload({
            url: '/common/upload/image',
            secureuri: false,
            fileElementId: $f,
            data: {
                bucket: 'sns'
            },
            dataType: 'json',
            success: function(data /* , status */) {
                var url, relaUrl;

                if (data && data.code === 200 && data.data && data.data.images && data.data.images[0]) {
                    url = data.data.images[0];
                    relaUrl = data.data.imagesList[0];
                    $p.find('img').attr('src', url).attr('source-url', url);
                    $p.find('input[name=imgUrl]').val(relaUrl);
                    $p.addClass('selected');
                } else if (data && data.message) {
                    alert(data.message); // eslint-disable-line
                }
            },
            error: function() {    /** data, status, e **/
                alert('上传失败,请稍后再试!'); // eslint-disable-line
            },
            complete: function() {
                $f.clone().replaceAll($f);
            }
        });
    }
});

// comment form
$('.comment-table').on('click', '[data-role="showCommentForm"]', function() {
    // $('[data-role="showCommentForm"]).
    var $ntr = $(this).closest('tr').next('tr');

    if ($ntr.attr('data-role') === 'commentAddForm') {
        $ntr.toggle();
    }
});


// star
$('.comment-table').on('click', '.comment-star.editable > span', function() {
    $(this).parent().find('span').removeClass('active');
    $(this).addClass('active');
});

// btn group
$('.comment-add').on('click', ' .btn-group .btn', function() {
    $(this).siblings('.btn').removeClass('active');
    $(this).addClass('active');
});

// goods comment textarea
$('.comment-table').on('focus', '[data-role="goodsCommentWrap"] textarea', function() {
    $(this).parent().find('.text-tip').hide();
});
$('.comment-table').on('blur', '[data-role="goodsCommentWrap"] textarea', function() {
    if (!$(this).val()) {
        $(this).parent().find('.text-tip').show();
    }
});

$('.comment-table').on('click', '[data-role="goodsCommentWrap"] .text-tip', function() {
    $(this).parent().find('textarea').focus();
});
$('.comment-table').find('[data-role="goodsCommentWrap"] textarea').trigger('blur');