add detail page ssr

@@ -17,18 +17,32 @@ const searchModel = require('../models/search');
  * 商品详情
  */
 const component = {
-    index(req, res) {
+    index(req, res, next) {
         const pid = req.params[0],
             goodsId = req.params[1],
             cnAlphabet = req.params[2];
 
-        res.render('detail', {
-            module: 'product',
-            page: 'detail',
-            pid: pid,
-            goodsId: goodsId,
-            cnAlphabet: cnAlphabet
-        });
+        let params = {
+            product_id: _.toString(pid),
+            uid: req.user.uid || 0
+        };
+
+        model.product(params).then(product => {
+            product = product.data || {};
+
+            product.formatPrice = product.formatSalesPrice !== '0' ? product.formatSalesPrice : product.formatMarketPrice;
+            product.isDiscount = product.marketPrice > product.salesPrice;
+
+            console.log(product);
+            res.render('detail', {
+                module: 'product',
+                page: 'detail',
+                pid: pid,
+                goodsId: goodsId,
+                cnAlphabet: cnAlphabet,
+                product: product
+            });
+        }).catch(next);
     },
     product(req, res, next) {
         const pid = req.params[0]; // , goodsId = req.params[1];
@@ -164,4 +178,4 @@ const component = {
     }
 };
 
-module.exports = component;
\ No newline at end of file
+module.exports = component;

 <div id="app" class="product-page" data-pid="{{pid}}" data-goods-id="{{goodsId}}">
-  <app/>
+    {{#product}}
+    <div class="ssr show-box first-box">
+        <div class="image-carousel">
+            <div class="swipe">
+                <div class="swipe-items-wrap">
+                    {{#each goodsList}}
+                        {{#if colorImage}}
+                        <div class="swipe-item {{#if @first}}active{{/if}}"> <img width="100%" alt="" src="{{image2 colorImage w=750 h=1000 q=80}}"></div>
+                        {{/if}}
+                    {{/each}}
+                </div>
+            </div>
+        </div>
+        <div class="title-box">
+            <h1 class="line-clamp-2">{{productName}}</h1>
+            {{#if isDiscount}}
+                <i class="price strike-through">{{formatMarketPrice}}</i>
+            {{/if}}
+            <i class="price {{#if isDiscount}}highlight{{/if}}">{{formatPrice}}</i>
+        </div>
+    </div>
+    {{#brandInfo}}
+    <div class="ssr show-box brand">
+        <img src="{{image2 brandIco w=110 h=68 q=80}}">
+        <h2>{{brandName}}</h2>
+        <div class="brand-go">
+            <span>进入店铺</span>
+            <span class="icon icon-right"></span>
+        </div>
+        <a href="/product/shop/{{brandDomain}}"></a>
+    </div>
+    {{/brandInfo}}
+    {{/product}}
+    <app/>
 </div>

@@ -15,6 +15,17 @@ yoho.ready(() => {
         el: '#app',
         components: {
             app: app
+        },
+        created() {
+            setTimeout(() => {
+                let ssrs = document.querySelectorAll('.ssr') || [];
+
+                ssrs.forEach(i => {
+                    if (i) {
+                        i.remove();
+                    }
+                });
+            }, 500);
         }
     });
-});
\ No newline at end of file
+});