商品收藏

+/**
+ * 商品详情页controller
+ * @author: yyq<yanqing.yang@yoho.cn>
+ * @date: 2016/7/17
+ */
+'use strict';
+
+const helpers = global.yoho.helpers;
+const fav = require('../models/favorite');
+
+const product = (req, res, next) => {
+    let uid = req.user.uid;
+    let pid = req.body.productId;
+    let type = (req.body.type === 'add');
+    let resData = {
+        code: 400,
+        message: '操作失败'
+    };
+
+    if (uid) {
+        if (pid) {
+            fav.toggleFavProduct(pid, uid, type).then(result => {
+                res.json(result);
+            }).catch(next);
+            return;
+        }
+
+    } else {
+        Object.assign(resData, {
+            code: 403,
+            message: '请登录后执行该操作',
+            data: {
+                refer: helpers.urlFormat('/signin')
+            }
+        });
+    }
+    res.json(resData);
+};
+
+module.exports = {
+    product // 组件demo页
+};

+/**
+ * 收藏相关接口
+ * @author: yyq<yanqing.yang@yoho.cn>
+ * @date: 2016/7/17
+ */
+
+'use strict';
+
+const api = global.yoho.API;
+
+const addFavAsync = (uid, pid) => {
+    return api.get('', {
+        method: 'app.favorite.add',
+        id: pid,
+        uid: uid,
+        type: 'product'
+    });
+};
+
+const cancelFavAsync = (uid, pid) => {
+    return api.get('', {
+        method: 'app.favorite.cancel',
+        fav_id: pid,
+        uid: uid,
+        type: 'product'
+    });
+};
+
+module.exports = {
+    addFavAsync,
+    cancelFavAsync
+};

+/**
+ * 收藏相关接口
+ * @author: yyq<yanqing.yang@yoho.cn>
+ * @date: 2016/7/17
+ */
+
+'use strict';
+
+const FavAPI = require('./favorite-api');
+
+const toggleFavProduct = (productId, uid, isadd) => {
+    if (isadd) {
+        return FavAPI.addFavAsync(uid, productId);
+    } else {
+        return FavAPI.cancelFavAsync(uid, productId);
+    }
+};
+
+
+module.exports = {
+    toggleFavProduct
+};

@@ -207,6 +207,7 @@ const setBrandBanner = brand => {
  */
 const setProductData = base => {
     let resData = {
+        id: base.id,
         name: base.productName,
         brandName: _.has(base, 'brand.brandName') ? base.brand.brandName : '',
         intro: base.salesPhrase,

@@ -35,7 +35,7 @@ const _getMultiResourceByBaseInfo = (base) => {
             comfort: result[1].data,
             modelTry: result[2].data,
             sort: result[3].data,
-            productFav: (result[4] && result[4].data) ? true : false
+            productFav: (result[4] && result[4].data)
         };
     });
 };

@@ -10,6 +10,7 @@ const router = require('express').Router(); // eslint-disable-line
 const cRoot = './controllers';
 const list = require(cRoot + '/list');
 const item = require(cRoot + '/item');
+const fav = require(cRoot + '/favorite');
 const shop = require(cRoot + '/shop');
 const query = require(cRoot + '/query');
 
@@ -18,7 +19,7 @@ router.get('/list', list.index); // 列表页面
 router.get('/list/new', list.newPage); // 新品列表页
 
 router.get(/\/item\/([\d]+)_([\d]+).html/, item.index); // 商品详情页
-router.get('/item/togglecollect', item.collect); // 商品详情页
+router.post('/item/togglecollect', fav.product); // 商品详情页
 
 router.get('/shop/:domain/list', shop.list);
 router.get('/shop/:domain', shop.index);

@@ -6,7 +6,7 @@
         {{> path-nav}}
 
         {{# goodInfo}}
-            <div class="product-main clearfix">
+            <div class="product-main clearfix" data-id="id">
                 <div class="thumbs left clearfix">
                     <div class="thumb-list hide">
                         {{# colors}}
@@ -123,7 +123,8 @@
                                 </span>
                                 <span class="collected">
                                     <i class="iconfont">&#xe627;</i>
-                                    已收藏
+                                    <em>已收藏</em>
+                                    <em class="cal-col">取消收藏</em>
                                 </span>
                             </span>
                         </p>

@@ -6,7 +6,8 @@
 var $ = require('yoho-jquery'),
     lazyload = require('yoho-jquery-lazyload');
 
-var $mainThumb = $('#main-thumb'),
+var $main = $('.product-main'),
+    $mainThumb = $('#main-thumb'),
     $checkBtns = $('.check-btns');
 
 var $tradeWrapper = $('.trade-wrapper'),
@@ -25,7 +26,8 @@ var $thumbCur = $('.thumb-wrap .cur'); // 当前选中展示图片
 
 var SLIDETIME = 200;
 
-var thumbsLoaded = [];
+var thumbsLoaded = [],
+    id = $main.data('id');
 
 require('../common/header');
 
@@ -179,3 +181,28 @@ $addToBag.click(function() {
         });
     }
 });
+
+$('#collect-product').click(function() {
+    var $this = $(this),
+        param = {
+            productId: id,
+            type: 'add'
+        };
+
+    if ($this.hasClass('coll')) {
+        param.type = 'cancel';
+    }
+
+    $.ajax({
+        type: 'POST',
+        url: '/product/item/togglecollect',
+        data: param
+    }).then(function(data) {
+        if (data.code === 200) {
+            $this.toggleClass('coll');
+        } else if (data.code === 403) {
+            location.href = data.data.refer;
+        }
+    });
+
+});

@@ -200,9 +200,22 @@
                 font-size: 14px;
             }
 
-            .collected {
+        }
+
+        .collected {
+            display: none;
+
+            .cal-col {
                 display: none;
             }
+
+            &:hover em {
+                display: none;
+            }
+
+            &:hover .cal-col {
+                display: inline;
+            }
         }
 
         .coll {