exchange

@@ -81,12 +81,47 @@ const detailExchange = (req, res) => {
         content: {
             nav: mcHandler.getMeCrumb('我的退/换货'),
             navigation: mcHandler.getSideMenu('我的退/换货'),
-            banner: 'http://placehold.it/{width}x{height}'
-
-            // exchange: {
-
-
-            // }
+            banner: 'http://placehold.it/{width}x{height}',
+
+            exchange: {
+                // audit: true,
+                // through: false,
+                // send: true,
+                finish: true,
+                way: '上门送货',
+                goods: [
+                    {
+                        img: '',
+                        name: 'fdefwfwefwrefverfref',
+                        color: '',
+                        size: '',
+                        num: '',
+                        reason: '',
+                        exchangeColor: '蓝色',
+                        exchangeSize: 'M'
+                    },
+                    {
+                        img: '',
+                        name: 'fdefwfwefwrefverfref',
+                        color: '',
+                        size: '',
+                        num: '',
+                        reason: '',
+                        exchangeColor: '蓝色',
+                        exchangeSize: 'M'
+                    }
+                ],
+                reasonInfo: [
+                    {
+                        problem: '太小了',
+                        img: ''
+                    },
+                    {
+                        problem: '太小了',
+                        img: ''
+                    }
+                ]
+            }
         }
     });
 };

-{{!-- {{# exchange}} --}}
+{{# exchange}}
 <div class="exchange-detail-page">
+    {{#if audit}}
     <p class="state"><span class="iconfont">&#xe618;</span>换货申请审核中</p>
+    {{/if}}
+
+    {{#if through}}
+     <p class="state"><span class="iconfont">&#xe60f;</span>换货申请已通过</p>
+    {{/if}}
+
+    {{#if send}}
+     <p class="state"><span class="iconfont">&#xe61a;</span>换货商品已发出</p>
+    {{/if}}
+
+    {{#if finish}}
+     <p class="state"><span class="iconfont">&#xe60f;</span>换货完成</p>
+    {{/if}}
 
     <div class="way">
+
+        {{#if finish}}
+        <p class="contact">如有疑问，请联系<span class="iconfont">&#xe61c;</span>在线客服</p>
+        {{else}}
         <p class="way-title">您已选择{{way}}</p>
         <p>请将商品连同吊牌、包装、发货单（如无发货单，您可找张白纸上注明订单编号，收货人姓名及手机号码）、发票（如有）、赠品（如有）一并保存，
         如有遗漏将影响您的退换货进度，敬请谅解
         </p>
+        {{/if}}
+
+        {{#if audit}}
         <p class="cancel">如果您不想换货了，您可以<span class="cancel-btn">取消申请</span></p>
+        {{/if}}
+
+        {{#if finish}}
+        <div class="order">
+            <span class="check">查看</span>
+            <span class="exchange-order">换货订单</span>
+        </div>
+        {{/if}}
     </div>
 
     <div class="adress">
@@ -20,6 +49,8 @@
         </div>
     </div>
 
+    <span class="exchange-goods">换货商品</span>
+
     <div class="good-info">
         <div class="table">
             <ul class="header">
@@ -30,11 +61,12 @@
         </div>
 
         <div class="table">
+            {{# goods}}
             <div class="table-body">
                 <div class="goods-info">
                     <img class="lazy" data-original="{{image img 70 90}}">
                     <div class="info">
-                        <p class="good-name">{{!-- {{name}} --}}fdefwfwefwrefverfref</p>
+                        <p class="good-name">{{name}}</p>
                         <p>颜色：{{color}}&nbsp;尺码：{{size}}</p>
                         <p>×{{num}}</p>
                     </div>
@@ -43,18 +75,21 @@
                     <p class="reason">{{reason}}发错货</p>
                 </div>
                 <div class="common-column special-border operation">
-                    <p class="subtext">color: 蓝色<br>size: M</p>
+                    <p class="subtext">color: {{exchangeColor}}<br>size: {{exchangeSize}}</p>
                 </div>
             </div>
+            {{/ goods}}
+            {{# reasonInfo}}
             <div class="reason-info">
-                <span>问题描述：太小了</span>
+                <span>问题描述：{{problem}}</span>
                 <div class="reason-img">照片凭证：
                     <div class="evidence">
                         <img src="{{image img 70 90}}">
                     </div>
                 </div>
             </div>
+            {{/ reasonInfo}}
         </div>
     </div>
 </div>
-{{!-- {{/ exchange}} --}}
\ No newline at end of file
+{{/ exchange}}
\ No newline at end of file

@@ -45,11 +45,44 @@
             text-align: center;
             margin-top: 10px;
         }
+
+        .contact {
+            line-height: 50px;
+
+            span {
+                margin-left: 20px;
+            }
+
+            .iconfont {
+                font-size: 12px;
+                margin-right: 5px;
+            }
+        }
+    }
+
+    .order {
+        margin: 23px 0 10px 0;
+        height: 50px;
+        line-height: 50px;
+        overflow: hidden;
+    }
+
+    .check {
+        display: block;
+        height: 25px;
+        width: 70px;
+        background: #1b1b1b;
+        color: #fff;
+        line-height: 25px;
+        text-align: center;
+        margin-top: 10px;
+        float: left;
+        margin-right: 20px;
     }
 
     .adress {
         overflow: hidden;
-        margin-top: 30px;
+        margin: 30px 0 20px 0;
         font-size: 14px;
         border-bottom: 1px solid #eee;
 
@@ -84,6 +117,12 @@
         }
     }
 
+    .exchange-goods {
+        font-size: 16px;
+        height: 50px;
+        line-height: 50px;
+    }
+
     .table {
         width: 100%;
 
@@ -170,7 +209,7 @@
 
     .reason-info {
         overflow: hidden;
-        padding: 25px 0 0 20px;
+        padding: 25px 0 30px 20px;
         width: 100%;
         border: 1px solid #eee;
         border-top: none;