submit consult of good detail

xuqi
Commit 090116007913b1782be9e7a43a973f8d25a33353 1 parent 188eec22
Showing 4 changed files with 165 additions and 51 deletions
template/www.yohobuy.com/actions/product/item/index.phtml
web-static/js/product/item.js
web-static/sass/product/_detail.scss
yohobuy/www.yohobuy.com/application/modules/Product/controllers/Item.php
--- a/template/www.yohobuy.com/actions/product/item/index.phtml
View file @0901160
+++ b/template/www.yohobuy.com/actions/product/item/index.phtml
View file @0901160
@@ -136,7 +136,7 @@
                                         {{/each}}
                                         <span class="size-ruler"></span>
-                                        <span class="size-warn hide">
+                                        <span class="size-warn warn-tip hide">
                                             <i class="iconfont">&#xe62c;</i>
                                             请选择尺码
                                         </span>
@@ -153,7 +153,7 @@
                                             <i id="plus-num" class="plus iconfont">&#xe610;</i>
                                             <i id="minus-num" class="minus iconfont">&#xe600;</i>
                                         </span>
-                                        <span id="num-warn" class="num-warn hide">
+                                        <span id="num-warn" class="num-warn warn-tip hide">
                                             <i class="iconfont">&#xe62c;</i>
                                             库存不足
                                         </span>
@@ -361,7 +361,7 @@
                             <span class="sep">|</span>
                             <span class="title cur">购买评价（{{commentNum}}）</span>
                         </p>
-                        <div class="comments content">
+                        <div class="comments cc-content">
                             <h2>购买评价（{{commentNum}}）</h2>
                             <ul id="comments-ul">
                                 {{# comments}}
@@ -395,7 +395,7 @@
                             </p>
                         </div>
-                        <div class="consults content">
+                        <div class="consults cc-content">
                             <h2>顾客咨询（{{consultNum}}）</h2>
                             <ul id="consults-ul">
                                 {{# consults}}
@@ -428,20 +428,27 @@
                             </p>
                             <div class="new-consult hide">
                                 <textarea class="my-consult"></textarea>
-                                <span class="warn-tip">
+                                <span class="consult-warn warn-tip hide">
                                     <i class="iconfont">&#xe62c;</i>
                                     请输入咨询内容
                                 </span>
                                 <div class="captcha-row">
                                     <input class="captcha" type="text">
                                     <img class="captcha-img" src="http://www.yohobuy.com/passport/images?g=consult">
-                                    <span class="warn-tip">
+                                    <span class="captcha-warn warn-tip hide">
                                         <i class="iconfont">&#xe62c;</i>
-                                        请输入验证码
+                                        <em>请输入验证码</em>
                                     </span>
                                 </div>
                                 <span id="submit-consult" class="btn submit-consult">提交咨询</span>
                             </div>
+
+                            <div class="consult-success hide">
+                                <p>
+                                    <span class="iconfont">&#xe61a;</span>
+                                    咨询成功，请等待客服回复
+                                </p>
+                            </div>
                         </div>
                     </div>
                 {{/ consultComment}}
--- a/web-static/js/product/item.js
View file @0901160
+++ b/web-static/js/product/item.js
View file @0901160
@@ -339,7 +339,79 @@ $('.consult-comment').on('click', '.title', function() {
 //我要咨询
 $('#consults-btn').click(function() {
+
+    //TODO:点击我要资讯的时候更新验证码显示
     $('.new-consult').removeClass('hide');
+    $('.consult-success').addClass('hide');
+});
+
+//提交咨询
+$('#submit-consult').click(function() {
+    var $this = $(this),
+        $parent = $this.closest('.new-consult'),
+        $textarea = $parent.find('.my-consult'),
+        $captcha = $parent.find('.captcha'),
+        content = $.trim($textarea.val()),
+        captcha = $.trim($captcha.val());
+
+    var $consultWarn = $parent.find('.consult-warn'),
+        $captchaWarn = $parent.find('.captcha-warn');
+
+    var pass = true;
+
+    if (content === '') {
+        $textarea.addClass('error');
+        $consultWarn.removeClass('hide');
+
+        pass = false;
+    } else {
+        $textarea.removeClass('error');
+        $consultWarn.addClass('hide');
+    }
+
+    if (captcha === '') {
+        $captcha.addClass('error');
+        $captchaWarn.removeClass('hide').children('em').text('请输入验证码');
+
+        pass = false;
+    } else {
+        $captcha.removeClass('error');
+        $captchaWarn.addClass('hide');
+    }
+
+    if (pass === false) {
+        return;
+    }
+
+    $.ajax({
+        type: 'GET',
+        url: '/product/item/consult',
+        data: {
+            content: content,
+            captcha: captcha
+        }
+    }).then(function(data) {
+        var code = data.code;
+
+        if (code === 200) {
+            $parent.addClass('hide');
+
+            $parent.siblings('.consult-success').removeClass('hide');
+
+            //清空输入
+            $textarea.val('');
+            $captcha.val('');
+        } else if (code === 400) {
+
+            //跳转登录页
+            location.href = data.href;
+        } else if (code === 401) {
+
+            //验证码错误
+            $captcha.addClass('error');
+            $captchaWarn.removeClass('hide').children('em').text('验证码错误');
+        }
+    });
 });
 //售后服务
--- a/web-static/sass/product/_detail.scss
View file @0901160
+++ b/web-static/sass/product/_detail.scss
View file @0901160
@@ -251,16 +251,8 @@
         }
         .size-warn, .num-warn {
-            display: inline-block;
             height: 24px;
             line-height: 24px;
-            color: #e01;
-            margin-left: 7px;
-            font-size: 12px;
-
-            i {
-                font-size: 14px;
-            }
         }
         .color-size-tip {
@@ -583,7 +575,7 @@
         }
     }
-    .consult-comment .content {
+    .cc-content {
         background: #f5f7f6;
         padding: 20px 20px 0 20px;
         font-size: 12px;
@@ -670,47 +662,69 @@
         .consults {
             display: none;
         }
+    }
-        .new-consult {
-            padding: 20px 0;
-            border-top: 1px solid #eaeceb;
+    .new-consult {
+        padding: 20px 0;
+        border-top: 1px solid #eaeceb;
-            textarea {
-                width: 590px;
-                height: 80px;
-                margin-top: 8px;
-                padding: 5px;
-                color: #ccc;
-            }
+        textarea {
+            width: 590px;
+            height: 80px;
+            margin-top: 8px;
+            padding: 5px;
+            outline: none;
+        }
-            .captcha-row {
-                margin: 10px 0;
-            }
+        .captcha-row {
+            margin: 10px 0;
+        }
-            .captcha {
-                width: 70px;
-                height: 20px;
-                line-height: 20px;
-                border: 1px solid #ccc;
-                margin-right: 5px;
-                padding: 5px;
-                color: #ccc;
-            }
+        .captcha {
+            width: 70px;
+            height: 20px;
+            line-height: 20px;
+            border: 1px solid #ccc;
+            margin-right: 5px;
+            padding: 5px;
+            outline: none;
+        }
-            .captcha-img {
-                border: 0;
-                height: 32px;
-                width: 96px;
-                vertical-align: middle;
-            }
+        .captcha-img {
+            border: 0;
+            height: 32px;
+            width: 96px;
+            vertical-align: middle;
+        }
-            .submit-consult {
-                display: block;
-                width: 140px;
-                height: 32px;
-                line-height: 32px;
-                margin: 0;
-            }
+        .submit-consult {
+            display: block;
+            width: 140px;
+            height: 32px;
+            line-height: 32px;
+            margin: 0;
+        }
+
+        .error {
+            border-color: #e01;
+        }
+    }
+
+    .consult-success {
+        border-top: 1px solid #eaeceb;
+        margin-top: 30px;
+        text-align: center;
+        padding: 20px 0;
+
+        p {
+            width: 295px;
+            height: 55px;
+            line-height: 55px;
+            margin: 0 auto;
+            border: 2px solid #222;
+            display: block;
+            color: #222;
+            font-weight: bold;
         }
     }
@@ -728,6 +742,7 @@
             background: #eaeceb;
             text-align: center;
             font-size: 12px;
+            cursor: pointer;
             .iconfont {
                 font-size: 12px;
@@ -823,4 +838,15 @@
             color: #999;
         }
     }
+
+    .warn-tip {
+        display: inline-block;
+        color: #e01;
+        margin-left: 7px;
+        font-size: 12px;
+
+        i {
+            font-size: 14px;
+        }
+    }
 }
--- a/yohobuy/www.yohobuy.com/application/modules/Product/controllers/Item.php
View file @0901160
+++ b/yohobuy/www.yohobuy.com/application/modules/Product/controllers/Item.php
View file @0901160
@@ -374,4 +374,13 @@ class ItemController extends AbstractAction
     {
         echo(' ');
     }
+
+    public function consultAction()
+    {
+        $this->echoJson(
+            array(
+                'code' => 200
+            )
+        );
+    }
 }