fe / yohoblk-wap · Commits

Go to a project

Authored by Aiden Xu
Commit ae50baf9a61ba5370d1d4a865824e29e54ea0519 1 parent 07f9e6ba

商品详情

Inline Side-by-side
Showing 19 changed files with 196 additions and 70 deletions
@@ -30,8 +30,8 @@ const component = { @@ -30,8 +30,8 @@ const component = {
30 30
31 let params = { 31 let params = {
32 productId: _.toString(pid), 32 productId: _.toString(pid),
33 - method: 'h5.product.data' // TODO replace this to 'app.product.data'  
34 - 33 + method: 'h5.product.data',
  34 + uid: req.user.uid || 8050378 // TODO: fix this hard coded uid
35 }; 35 };
36 36
37 api.get('', params).then(result => { 37 api.get('', params).then(result => {
@@ -40,7 +40,7 @@ const component = { @@ -40,7 +40,7 @@ const component = {
40 }, 40 },
41 intro(req, res, next) { 41 intro(req, res, next) {
42 let params = { 42 let params = {
43 - method: 'h5.product.intro', // TODO replace this to 'app.product.intro' 43 + method: 'h5.product.intro',
44 productskn: req.query.skn, 44 productskn: req.query.skn,
45 udid: 'f528764d624db129b32c21fbca0cb8d6' 45 udid: 'f528764d624db129b32c21fbca0cb8d6'
46 }; 46 };
@@ -68,30 +68,35 @@ const component = { @@ -68,30 +68,35 @@ const component = {
68 }; 68 };
69 69
70 api.get('', params).then(result => { 70 api.get('', params).then(result => {
71 - res.json(result);  
72 - }).catch(next);  
73 - },  
74 -  
75 - getFavorite(req, res, next) {  
76 - api.get('', {}).then(result => { 71 + if (result.code === 200) {
  72 + // 将 shopping_key 写入Cookie
  73 + res.cookie('_SPK', result.data.shopping_key, {maxAge: 86400 * 360});
  74 + }
77 res.json(result); 75 res.json(result);
78 }).catch(next); 76 }).catch(next);
79 }, 77 },
80 78
81 /** 79 /**
82 - * 收藏 80 + * 添加收藏/取消收藏
83 * 81 *
84 * @param req 82 * @param req
85 * @param res 83 * @param res
86 * @param next 84 * @param next
87 */ 85 */
88 - addFavorite(req, res, next) { 86 + favorite(req, res, next) {
89 let params = { 87 let params = {
90 - method: 'app.Shopping.addfavorite',  
91 - product_sku_list: req.body.sku,  
92 - uid: req.user.uid || 8050378 // TODO: fix this hard coded uid 88 + uid: req.user.uid || 8050378, // TODO: fix this hard coded uid
  89 + type: 'product'
93 }; 90 };
94 91
  92 + if (req.body.operation === 'add') {
  93 + params.id = req.body.id;
  94 + params.method = 'app.favorite.add';
  95 + } else if (req.body.operation === 'remove') {
  96 + params.fav_id = req.body.id;
  97 + params.method = 'app.favorite.cancel';
  98 + }
  99 +
95 api.get('', params).then(result => { 100 api.get('', params).then(result => {
96 res.json(result); 101 res.json(result);
97 }).catch(next); 102 }).catch(next);
@@ -29,7 +29,6 @@ router.get(/\/pro_([\d]+)_([\d]+)\/(.*)/, detail.index); // 商品详情routers @@ -29,7 +29,6 @@ router.get(/\/pro_([\d]+)_([\d]+)\/(.*)/, detail.index); // 商品详情routers
29 router.get(/\/product_([\d]+)_([\d]+)\.json/, detail.product); 29 router.get(/\/product_([\d]+)_([\d]+)\.json/, detail.product);
30 router.get(/\/intro\.json/, detail.intro); 30 router.get(/\/intro\.json/, detail.intro);
31 router.post(/cart.json/, detail.addToCart); 31 router.post(/cart.json/, detail.addToCart);
32 -router.get(/favorite.json/, detail.getFavorite);  
33 -router.post(/favorite.json/, detail.addFavorite); 32 +router.post(/favorite.json/, detail.favorite);
34 router.get(/cart-count.json/, detail.getCartCount); 33 router.get(/cart-count.json/, detail.getCartCount);
35 module.exports = router; 34 module.exports = router;
No preview for this file type
1 <?xml version="1.0" standalone="no"?> 1 <?xml version="1.0" standalone="no"?>
2 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" > 2 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
3 <svg xmlns="http://www.w3.org/2000/svg"> 3 <svg xmlns="http://www.w3.org/2000/svg">
4 -<metadata>Generated by IcoMoon</metadata> 4 +<metadata>
  5 +Created by FontForge 20120731 at Fri Jul 22 13:41:45 2016
  6 + By admin
  7 +</metadata>
5 <defs> 8 <defs>
6 -<font id="iconfont" horiz-adv-x="1024">  
7 -<font-face units-per-em="1024" ascent="896" descent="-128" />  
8 -<missing-glyph horiz-adv-x="1024" />  
9 -<glyph unicode="&#x20;" horiz-adv-x="0" d="" />  
10 -<glyph unicode="&#xe600;" glyph-name="delete" d="M911 809h-242v123q0 21-13.5 34.5t-34.5 13.5h-246q-20 0-33.5-13.5t-13.5-34.5v-123h-246q-21 0-34.5-13.5t-13.5-34 13.5-34 34.5-13.5h829q21 0 34.5 13.5t13.5 34-13.5 34-34.5 13.5zM423 809v72h147v-72h-147zM765 663q-21 0-34.5-14t-13.5-34v-560h-441v560q0 20-13.5 34t-34 14-34-14-13.5-34v-611q0-21 13.5-34.5t34.5-13.5h536q20 0 33.5 13.5t13.5 34.5v611q3 20-11.5 34t-35.5 14zM447 151v389q0 20-13.5 33.5t-34 13.5-34-13.5-13.5-33.5v-389q0-21 13.5-34.5t34-13.5 34 13.5 13.5 34.5zM645 151v389q0 20-13.5 33.5t-34.5 13.5q-20 0-35.5-13.5t-15.5-33.5v-389q0-21 13.5-34.5t34.5-13.5 36 13.5 15 34.5z" />  
11 -<glyph unicode="&#xe601;" glyph-name="bag" d="M512 896q43 0 82.5-17t68-45.5 45.5-68 17-82.5v-43h171v-640q0-53-37.5-90.5t-90.5-37.5h-512q-53 0-90.5 37.5t-37.5 90.5v640h171v43q0 43 17 82.5t45.5 68 68 45.5 82.5 17zM811 0v555h-598v-555q0-18 12.5-30.5t30.5-12.5h512q18 0 30.5 12.5t12.5 30.5zM512 811q-53 0-90.5-37.5t-37.5-90.5v-43h256v43q0 53-37.5 90.5t-90.5 37.5z" />  
12 -<glyph unicode="&#xe602;" glyph-name="down" d="M516 340l409 404q2 1 6 6t7 8 8 7 9 5.5 8.5 2 8.5-2.5l38-21q7-7 7.5-17.5t-6.5-17.5l-476-471q-7-8-17.5-8t-17.5 7zM531 242q-8-7-18.5-7t-17.5 8l-475 471q-7 7-7 17.5t7 17.5l38 21q4 3 8.5 2.5t8.5-2 9-5.5 8-7 7-8 6-6l415-407z" />  
13 -<glyph unicode="&#xe603;" glyph-name="check" d="M998.5 808.5q-12.5 11.5-29.5 11t-29-12.5l-552-588-302 297q-12 12-29.5 12t-29.5-12.5-12-29.5 13-29l332-327v-1q2-1 9-5 1-1 2.5-2t2.5-1q7-3 15-3t16 3q1 1 3 2l1 1q7 5 9 6l1 1 581 619q12 13 11.5 30t-13 28.5z" />  
14 -<glyph unicode="&#xe605;" glyph-name="close" d="M512 499l360 360 45-45-360-360 360-359-45-45-360 359-360-359-45 45 360 359-360 360 45 45z" />  
15 -<glyph unicode="&#xe606;" glyph-name="left" d="M245 468l-9 9 472 472 80-80-400-401 400-401-80-80-472 472z" />  
16 -<glyph unicode="&#xe607;" glyph-name="right" d="M785 468l13 13-488 487-84-84 416-416-416-416 84-84 488 487z" />  
17 -<glyph unicode="&#xe608;" glyph-name="search" d="M682 158q-108-89-249-89-107 0-197.5 53t-143.5 143.5-53 197.5 53 197.5 143.5 143.5 197.5 53 197.5-53 143.5-143.5 53-197.5q0-141-89-249l286-286-56-56zM433.5 148q130.5 0 222.5 92t92 222.5-92 223-222.5 92.5-223-92.5-92.5-223 92.5-222.5 223-92z" />  
18 -<glyph unicode="&#xe609;" glyph-name="print" horiz-adv-x="1001" d="M281 627q-27-1-53-1h-83q-18 0-36.5-6t-32.5-18.5-23-32-9-45.5v-76h912v41q0 16-0.5 30t-0.5 18q0 13-5 29t-17 29.5-31.5 22.5-49.5 9h-133v-97h-438v97zM955 394v-52q0-23 0.5-52t0.5-58-10.5-47.5-26-30-33-16-31.5-4.5q-14-1-29.5-0.5t-29.5 0.5h-32l-45 128h-439l-44-128h-63q-20 0-45 1-25 0-41 9.5t-25.5 23-13.5 29.5-4 30v167h911zM163 331q-12 0-21-8.5t-9-21.5 9-21.5 21-8.5q13 0 22 8.5t9 21.5-9 21.5-22 8.5zM316 207q-8-26-14-48-5-19-10.5-37t-7.5-25-3-15 1-14.5 9.5-10.5 21.5-4h365q23 0 34 12t2 38q-5 13-9.5 30.5t-9.5 34.5q-5 19-11 39h-368zM336 582v228q0 11 2.5 23t10 21.5 20.5 15.5 34 6h188q31 0 51.5-14.5t20.5-52.5v-227h-327z" />  
19 -<glyph unicode="&#xe60d;" glyph-name="love" d="M734 944q-65 0-123.5-31t-99.5-85q-41 54-99.5 85t-124.5 31q-118 0-202.5-92t-84.5-222q0-37 7-70.5t21.5-65 25-50 29.5-48.5q31-48 82.5-105.5t98-101.5 100-90 75-63.5 35.5-28.5q17-13 37-13t37 13q13 11 35 28.5t75.5 63.5 100 90 98 101.5 81.5 105.5q19 30 29.5 48.5t25.5 50 22 65 7 70.5q0 130-84.5 222t-203.5 92zM886 436q-29-45-78-100t-98.5-101-95.5-85.5-74-62.5l-29-23q-11 9-30 24t-71.5 60-98 88-96 99-79.5 101q-24 37-37 60.5t-24 60-11 73.5q0 101 65.5 172.5t157.5 71.5q68 0 123-40t82-105v0q4-15 19-15t19 15q27 65 82 105t122 40q93 0 158.5-71.5t65.5-172.5q0-37-11.5-73.5t-24-60-36.5-60.5z" />  
20 -<glyph unicode="&#xe617;" glyph-name="up" d="M24 178l22-22q9-10 22-10t23 10l424 430 420-426q9-9 21.5-9t21.5 9l22 22q9 9 9 22t-9 23l-458 464q-5 5-12 7-9 7-20.5 6t-20.5-9l-465-472q-9-9-9-22t9-23z" />  
21 -<glyph unicode="&#xe900;" glyph-name="sort-asc" horiz-adv-x="585" d="M585.143 475.428q0-14.857-10.857-25.714t-25.714-10.857h-512q-14.857 0-25.714 10.857t-10.857 25.714 10.857 25.714l256 256q10.857 10.857 25.714 10.857t25.714-10.857l256-256q10.857-10.857 10.857-25.714z" />  
22 -<glyph unicode="&#xe901;" glyph-name="sort-desc" horiz-adv-x="585" d="M585.143 256q0-14.857-10.857-25.714l-256-256q-10.857-10.857-25.714-10.857t-25.714 10.857l-256 256q-10.857 10.857-10.857 25.714t10.857 25.714 25.714 10.857h512q14.857 0 25.714-10.857t10.857-25.714z" />  
23 -</font></defs></svg>  
  9 +<font id="iconfont" horiz-adv-x="1024" >
  10 + <font-face
  11 + font-family="iconfont"
  12 + font-weight="500"
  13 + font-stretch="normal"
  14 + units-per-em="1024"
  15 + panose-1="2 0 6 3 0 0 0 0 0 0"
  16 + ascent="896"
  17 + descent="-128"
  18 + x-height="792"
  19 + bbox="13 -212 1024 896"
  20 + underline-thickness="50"
  21 + underline-position="-100"
  22 + unicode-range="U+0078-E617"
  23 + />
  24 +<missing-glyph horiz-adv-x="374"
  25 +d="M34 0v682h272v-682h-272zM68 34h204v614h-204v-614z" />
  26 + <glyph glyph-name=".notdef" horiz-adv-x="374"
  27 +d="M34 0v682h272v-682h-272zM68 34h204v614h-204v-614z" />
  28 + <glyph glyph-name=".null" horiz-adv-x="0"
  29 + />
  30 + <glyph glyph-name="nonmarkingreturn" horiz-adv-x="341"
  31 + />
  32 + <glyph glyph-name="x" unicode="x" horiz-adv-x="1001"
  33 +d="M281 543q-27 -1 -53 -1h-83q-18 0 -36.5 -6t-32.5 -18.5t-23 -32t-9 -45.5v-76h912v41q0 16 -0.5 30t-0.5 18q0 13 -5 29t-17 29.5t-31.5 22.5t-49.5 9h-133v-97h-438v97zM955 310v-52q0 -23 0.5 -52t0.5 -58t-10.5 -47.5t-26 -30t-33 -16t-31.5 -4.5q-14 -1 -29.5 -0.5
  34 +t-29.5 0.5h-32l-45 128h-439l-44 -128h-29h-34q-20 0 -45 1q-25 0 -41 9.5t-25.5 23t-13.5 29.5t-4 30v167h911zM163 247q-12 0 -21 -8.5t-9 -21.5t9 -21.5t21 -8.5q13 0 22 8.5t9 21.5t-9 21.5t-22 8.5zM316 123q-8 -26 -14 -48q-5 -19 -10.5 -37t-7.5 -25t-3 -15t1 -14.5
  35 +t9.5 -10.5t21.5 -4h37h67h81h80h64h36q23 0 34 12t2 38q-5 13 -9.5 30.5t-9.5 34.5q-5 19 -11 39h-368zM336 498v228q0 11 2.5 23t10 21.5t20.5 15.5t34 6h188q31 0 51.5 -14.5t20.5 -52.5v-227h-327z" />
  36 + <glyph glyph-name="uniE600" unicode="&#xe600;"
  37 +d="M911 725h-242v123q0 21 -13.5 34.5t-34.5 13.5h-246q-20 0 -33.5 -13.5t-13.5 -34.5v-123h-246q-21 0 -34.5 -13.5t-13.5 -34t13.5 -34t34.5 -13.5h829q21 0 34.5 13.5t13.5 34t-13.5 34t-34.5 13.5zM423 725v72h147v-72h-147zM765 579q-21 0 -34.5 -14t-13.5 -34v-560
  38 +h-441v560q0 20 -13.5 34t-34 14t-34 -14t-13.5 -34v-611q0 -21 13.5 -34.5t34.5 -13.5h536q20 0 33.5 13.5t13.5 34.5v611q3 20 -11.5 34t-35.5 14zM447 67v389q0 20 -13.5 33.5t-34 13.5t-34 -13.5t-13.5 -33.5v-389q0 -21 13.5 -34.5t34 -13.5t34 13.5t13.5 34.5zM645 67
  39 +v389q0 20 -13.5 33.5t-34.5 13.5q-20 0 -35.5 -13.5t-15.5 -33.5v-389q0 -21 13.5 -34.5t34.5 -13.5t36 13.5t15 34.5z" />
  40 + <glyph glyph-name="uniE601" unicode="&#xe601;"
  41 +d="M512 812q43 0 82.5 -17t68 -45.5t45.5 -68t17 -82.5v-43h171v-640q0 -53 -37.5 -90.5t-90.5 -37.5h-512q-53 0 -90.5 37.5t-37.5 90.5v640h171v43q0 43 17 82.5t45.5 68t68 45.5t82.5 17zM811 -84v555h-598v-555q0 -18 12.5 -30.5t30.5 -12.5h512q18 0 30.5 12.5
  42 +t12.5 30.5zM512 727q-53 0 -90.5 -37.5t-37.5 -90.5v-43h256v43q0 53 -37.5 90.5t-90.5 37.5z" />
  43 + <glyph glyph-name="uniE602" unicode="&#xe602;"
  44 +d="M516 256l409 404q2 1 6 6t7 8t8 7t9 5.5t8.5 2t8.5 -2.5l38 -21q7 -7 7.5 -17.5t-6.5 -17.5l-476 -471q-7 -8 -17.5 -8t-17.5 7zM86 669zM531 158q-8 -7 -18.5 -7t-17.5 8l-475 471q-7 7 -7 17.5t7 17.5l38 21q4 3 8.5 2.5t8.5 -2t9 -5.5t8 -7t7 -8t6 -6l415 -407z
  45 +M945 669z" />
  46 + <glyph glyph-name="uniE603" unicode="&#xe603;"
  47 +d="M998.5 724.5q-12.5 11.5 -29.5 11t-29 -12.5l-552 -588l-302 297q-12 12 -29.5 12t-29.5 -12.5t-12 -29.5t13 -29l332 -327v-1q2 -1 9 -5q1 -1 2.5 -2t2.5 -1q7 -3 15 -3t16 3q1 1 3 2l1 1q7 5 9 6l1 1l581 619q12 13 11.5 30t-13 28.5z" />
  48 + <glyph glyph-name="uniE604" unicode="&#xe604;"
  49 +d="M887 653q-19 24 -31 33l-4 4l-4 4q-53 51 -126 51q-103 0 -211 -106q-107 106 -210 106q-74 0 -126 -51l-5 -4l-3 -4q-12 -9 -31 -33q-74 -93 -60 -191q7 -48 33.5 -98.5t61.5 -92t80 -82.5t84 -70t77.5 -54.5t57.5 -36.5t28 -15l13 -7l14 7q8 4 27 15t58 36.5t78 54.5
  50 +t84 70t80 82.5t61.5 92t33.5 98.5q14 98 -60 191zM893 470q-7 -52 -43.5 -109t-81.5 -101t-100 -86.5t-91.5 -66t-65.5 -38.5q-28 15 -64.5 38.5t-92 66t-100 86.5t-81 101t-43.5 109q-13 92 75 176q4 5 11.5 12.5t32 20t52.5 12.5q87 0 189 -111l21 -23l22 23
  51 +q102 111 189 111q27 0 52 -12.5t32.5 -20t11.5 -12.5q88 -84 75 -176z" />
  52 + <glyph glyph-name="uniE605" unicode="&#xe605;"
  53 +d="M512 415l360 360l45 -45l-360 -360l360 -359l-45 -45l-360 359l-360 -359l-45 45l360 359l-360 360l45 45z" />
  54 + <glyph glyph-name="uniE606" unicode="&#xe606;"
  55 +d="M245 384l-9 9l472 472l80 -80l-400 -401l400 -401l-80 -80l-472 472z" />
  56 + <glyph glyph-name="uniE607" unicode="&#xe607;"
  57 +d="M785 384l13 13l-488 487l-84 -84l416 -416l-416 -416l84 -84l488 487z" />
  58 + <glyph glyph-name="uniE608" unicode="&#xe608;"
  59 +d="M682 74q-108 -89 -249 -89q-107 0 -197.5 53t-143.5 143.5t-53 197.5t53 197.5t143.5 143.5t197.5 53t197.5 -53t143.5 -143.5t53 -197.5q0 -141 -89 -249l286 -286l-56 -56zM433.5 64q130.5 0 222.5 92t92 222.5t-92 223t-222.5 92.5t-223 -92.5t-92.5 -223t92.5 -222.5
  60 +t223 -92z" />
  61 + <glyph glyph-name="uniE609" unicode="&#xe609;"
  62 +d="M513 17q-15 0 -121 93t-168 161q-37 40 -64 95.5t-27 99.5q0 97 61.5 166.5t149.5 69.5q49 0 93 -34.5t76 -86.5q31 52 75 86.5t93 34.5q88 0 150 -69.5t62 -166.5q0 -47 -27 -104t-65 -92q-20 -18 -61.5 -57t-74 -68.5t-67 -61t-57 -49t-28.5 -17.5z" />
  63 + <glyph glyph-name="uniE617" unicode="&#xe617;"
  64 +d="M24 94l22 -22q9 -10 22 -10t23 10l424 430l420 -426q9 -9 21.5 -9t21.5 9l22 22q9 9 9 22t-9 23l-458 464q-5 5 -12 7q-9 7 -20.5 6t-20.5 -9l-465 -472q-9 -9 -9 -22t9 -23z" />
  65 + </font>
  66 +</defs></svg>
No preview for this file type
No preview for this file type
@@ -28,7 +28,7 @@ class Overlay { @@ -28,7 +28,7 @@ class Overlay {
28 clickToClose: true, // 点击关闭 28 clickToClose: true, // 点击关闭
29 onClose: $.noop, // 关闭回调函数 29 onClose: $.noop, // 关闭回调函数
30 animation: 'fade', // 动画效果 30 animation: 'fade', // 动画效果
31 - disableScrolling: true 31 + disableScrolling: true // 是否禁止
32 }; 32 };
33 33
34 // 初始化参数 34 // 初始化参数
@@ -78,10 +78,12 @@ class Overlay { @@ -78,10 +78,12 @@ class Overlay {
78 }).show().addClass(this.settings.animationClasses.in); 78 }).show().addClass(this.settings.animationClasses.in);
79 this.isVisible = true; 79 this.isVisible = true;
80 80
  81 + if (this.settings.disableScrolling) {
81 $('body').css({ 82 $('body').css({
82 overflow: 'hidden' 83 overflow: 'hidden'
83 }); 84 });
84 } 85 }
  86 + }
85 87
86 /** 88 /**
87 * 关闭覆盖层 89 * 关闭覆盖层
1 const Vue = require('yoho-vue'); 1 const Vue = require('yoho-vue');
2 -const app = require('product/detail.vue'); 2 +const app = require('product/detail/index.vue');
3 3
4 require('../common/overlay'); 4 require('../common/overlay');
5 5
@@ -21,30 +21,10 @@ @@ -21,30 +21,10 @@
21 -moz-osx-font-smoothing: grayscale; 21 -moz-osx-font-smoothing: grayscale;
22 } 22 }
23 23
24 -.icon-sort-asc:before {  
25 - content: "\e900";  
26 -}  
27 -  
28 -.icon-sort-desc:before {  
29 - content: "\e901";  
30 -}  
31 -  
32 -.icon-print:before {  
33 - content: "\e609";  
34 -}  
35 -  
36 -.icon-delete:before {  
37 - content: "\e600";  
38 -}  
39 -  
40 .icon-bag:before { 24 .icon-bag:before {
41 content: "\e601"; 25 content: "\e601";
42 } 26 }
43 27
44 -.icon-down:before {  
45 - content: "\e602";  
46 -}  
47 -  
48 .icon-check:before { 28 .icon-check:before {
49 content: "\e603"; 29 content: "\e603";
50 } 30 }
@@ -65,11 +45,22 @@ @@ -65,11 +45,22 @@
65 content: "\e608"; 45 content: "\e608";
66 } 46 }
67 47
68 -.icon-love:before {  
69 - content: "\e60d"; 48 +.icon-down:before {
  49 + content: "\e602";
70 } 50 }
71 51
72 .icon-up:before { 52 .icon-up:before {
73 content: "\e617"; 53 content: "\e617";
74 } 54 }
75 55
  56 +.icon-delete:before {
  57 + content: "\e600";
  58 +}
  59 +
  60 +.icon-love:before {
  61 + content: "\e604";
  62 +}
  63 +
  64 +.icon-love-solid:before {
  65 + content: "\e609";
  66 +}
@@ -2,7 +2,7 @@ @@ -2,7 +2,7 @@
2 position: fixed; 2 position: fixed;
3 top: 50%; 3 top: 50%;
4 left: 50%; 4 left: 50%;
5 - z-index: 998; 5 + z-index: 1001;
6 transform: translate(-50%, -50%); 6 transform: translate(-50%, -50%);
7 display: table; 7 display: table;
8 max-width: 90%; 8 max-width: 90%;
  1 +/**
  2 + * 选项组件
  3 + *
  4 + * @author: Aiden Xu<aiden.xu@yoho.cn>
  5 + * @date: 2016/07/20
  6 + */
1 module.exports = { 7 module.exports = {
2 props: { 8 props: {
3 options: Array, 9 options: Array,
  1 +/**
  2 + * 颜色尺码选择组件
  3 + *
  4 + * @author: Aiden Xu<aiden.xu@yoho.cn>
  5 + * @date: 2016/07/20
  6 + */
  7 +
  8 +const tip = require('common/tip');
  9 +
  10 +
  11 +/**
  12 + * 颜色尺码选择组件
  13 + **
  14 + * @event feature.close 关闭事件
  15 + * @event feature:color.select 选择颜色
  16 + * @event feature:size.select 选择尺码
  17 + */
1 module.exports = { 18 module.exports = {
2 init() { 19 init() {
3 }, 20 },
4 props: { 21 props: {
  22 + /** 是否可见 */
5 isVisible: Boolean, 23 isVisible: Boolean,
  24 +
  25 + /** 实体对象 */
6 entity: Object, 26 entity: Object,
  27 +
  28 + /**
  29 + * 加入购物车回调函数
  30 + *
  31 + * @param result 后端返回的数据
  32 + */
7 onAddToCart: Function 33 onAddToCart: Function
8 }, 34 },
9 watch: { 35 watch: {
@@ -12,6 +38,7 @@ module.exports = { @@ -12,6 +38,7 @@ module.exports = {
12 38
13 if (this.isVisible) { 39 if (this.isVisible) {
14 this.overlay = $.overlay({ 40 this.overlay = $.overlay({
  41 + disableScrolling: false,
15 onClose: function() { 42 onClose: function() {
16 self.isVisible = false; 43 self.isVisible = false;
17 } 44 }
@@ -20,7 +47,7 @@ module.exports = { @@ -20,7 +47,7 @@ module.exports = {
20 this.overlay.show(); 47 this.overlay.show();
21 } else { 48 } else {
22 this.overlay.hide(); 49 this.overlay.hide();
23 - this.$parent.$emit('featureselector.close'); 50 + this.$parent.$emit('feature.close');
24 } 51 }
25 }, 52 },
26 entity() { 53 entity() {
@@ -149,6 +176,16 @@ module.exports = { @@ -149,6 +176,16 @@ module.exports = {
149 // console.log(`${this.selection.color}:${this.selection.size}`); 176 // console.log(`${this.selection.color}:${this.selection.size}`);
150 const sku = this.selection.size; 177 const sku = this.selection.size;
151 178
  179 + if (!this.selection.color) {
  180 + tip('请选择颜色');
  181 + return;
  182 + }
  183 +
  184 + if (!this.selection.size) {
  185 + tip('请选择尺码');
  186 + return;
  187 + }
  188 +
152 $.post('/product/cart.json', { 189 $.post('/product/cart.json', {
153 productSku: sku, 190 productSku: sku,
154 buyNumber: 1 191 buyNumber: 1
@@ -4,9 +4,11 @@ @@ -4,9 +4,11 @@
4 <div class="title-box"> 4 <div class="title-box">
5 <h1>{{entity.productName}}</h1> 5 <h1>{{entity.productName}}</h1>
6 6
7 - <i class="price" :class="{'strike-through': entity.productPriceBo.salesPrice > 0}">{{entity.productPriceBo.formatMarketPrice}}</i> 7 + <i class="price" v-if="entity.productPriceBo.marketPrice > entity.productPriceBo.salesPrice"
  8 + :class="{'strike-through': entity.productPriceBo.salesPrice > 0}">{{entity.productPriceBo.formatMarketPrice}}</i>
8 9
9 - <i v-if="entity.productPriceBo.salesPrice > 0" class="price highlight"> 10 + <i v-if="entity.productPriceBo.salesPrice > 0"
  11 + :class="{price: true, highlight: entity.productPriceBo.marketPrice > entity.productPriceBo.salesPrice}">
10 {{entity.productPriceBo.formatSalesPrice}} 12 {{entity.productPriceBo.formatSalesPrice}}
11 </i> 13 </i>
12 </div> 14 </div>
@@ -171,8 +173,9 @@ @@ -171,8 +173,9 @@
171 <span v-if="cartCount > 0" class="badge badge-tr">{{cartCount}}</span> 173 <span v-if="cartCount > 0" class="badge badge-tr">{{cartCount}}</span>
172 </a> 174 </a>
173 </button> 175 </button>
174 - <button class="button control-button" style="flex: 1">  
175 - <span class="icon icon-love"></span> 176 + <button class="button control-button" style="flex: 1" @click="toggleFavorite()">
  177 + <span v-if="entity.isCollect === 'Y' " class="icon icon-love-solid"></span>
  178 + <span v-else class="icon icon-love"></span>
176 </button> 179 </button>
177 <button class="button button-solid" style="flex: 2" 180 <button class="button button-solid" style="flex: 2"
178 @click="showAddToCart()" 181 @click="showAddToCart()"
@@ -189,5 +192,5 @@ @@ -189,5 +192,5 @@
189 <feature-selector :is-visible="showFeatureSelector" :entity="entity" 192 <feature-selector :is-visible="showFeatureSelector" :entity="entity"
190 :on-add-to-cart="onAddToCart"></feature-selector> 193 :on-add-to-cart="onAddToCart"></feature-selector>
191 </template> 194 </template>
192 -<style src="./css/detail.css"></style>  
193 -<script src="./js/detail.js"></script> 195 +<style src="./css/index.css"></style>
  196 +<script src="./js/index.js"></script>
  1 +/**
  2 + * 商品详情页
  3 + *
  4 + * @author: Aiden Xu<aiden.xu@yoho.cn>
  5 + * @date: 2016/07/19
  6 + */
  7 +
1 const app = $('#app'); 8 const app = $('#app');
2 const tip = require('common/tip'); 9 const tip = require('common/tip');
3 10
@@ -48,20 +55,51 @@ module.exports = { @@ -48,20 +55,51 @@ module.exports = {
48 showBox: require('../show-box.vue') 55 showBox: require('../show-box.vue')
49 }, 56 },
50 methods: { 57 methods: {
  58 + /**
  59 + * 添加到购物车
  60 + */
51 showAddToCart: function() { 61 showAddToCart: function() {
52 this.showFeatureSelector = true; 62 this.showFeatureSelector = true;
  63 + },
  64 +
  65 + /**
  66 + * 添加收藏
  67 + */
  68 + toggleFavorite: function() {
  69 + if (this.entity.isCollect === 'Y') {
  70 + $.post('/product/favorite.json', {
  71 + operation: 'remove',
  72 + id: this.entity.productPriceBo.productId
  73 + }).then((result)=> {
  74 + if (result.code === 200) {
  75 + tip('取消收藏成功');
  76 + this.entity.isCollect = 'N';
  77 + }
  78 + });
  79 + } else {
  80 + $.post('/product/favorite.json', {
  81 + operation: 'add',
  82 + id: this.entity.productPriceBo.productId
  83 + }).then((result)=> {
  84 + if (result.code === 200) {
  85 + tip('收藏成功');
  86 + this.entity.isCollect = 'Y';
  87 + }
  88 + });
  89 + }
53 } 90 }
54 }, 91 },
55 created() { 92 created() {
56 const self = this; 93 const self = this;
57 94
58 // 显示商品特征选择组件 95 // 显示商品特征选择组件
59 - this.$on('featureselector.close', function() { 96 + this.$on('feature.close', function() {
60 self.showFeatureSelector = false; 97 self.showFeatureSelector = false;
61 }); 98 });
62 99
63 // 读取基础数据 100 // 读取基础数据
64 - $.get(`/product/product_${app.data('pid')}_${app.data('goodsId')}.json`).then(result=> { 101 + $.get(`/product/product_${app.data('pid')}_${app.data('goodsId')}.json`).then((result) => {
  102 + // TODO: 异常处理
65 this.entity = result; 103 this.entity = result;
66 return result; 104 return result;
67 }).then((result)=> { 105 }).then((result)=> {
@@ -69,10 +107,12 @@ module.exports = { @@ -69,10 +107,12 @@ module.exports = {
69 return $.get('/product/product/intro.json', {skn: result.productPriceBo.productSkn}); 107 return $.get('/product/product/intro.json', {skn: result.productPriceBo.productSkn});
70 }).then(result => { 108 }).then(result => {
71 this.intro = result; 109 this.intro = result;
  110 + }).fail(err => {
  111 + console.log(err);
72 }); 112 });
73 113
74 // 读取购物车数量 114 // 读取购物车数量
75 - $.get('/product/cart-count.json', {}).then(result=> { 115 + $.get('/product/cart-count.json').then(result=> {
76 if (result.code === 200) { 116 if (result.code === 200) {
77 this.cartCount = result.data.cart_goods_count; 117 this.cartCount = result.data.cart_goods_count;
78 } 118 }