order opt

@@ -974,8 +974,9 @@
         sumCost: '199.00',
         sumCost: '199.00',
         //status
         //status
         completed: true, //已完成
         completed: true, //已完成
+        canceled: true, //已取消
         unpaid: true, //or 未支付
         unpaid: true, //or 未支付
-        unshipped: true, //or 未发货
+        unshipped: '', //or 未发货，查看物流URL
         unreceived: '', //or 未收货，查看物流URL
         unreceived: '', //or 未收货，查看物流URL
     }
     }
 
 
@@ -983,6 +984,8 @@
     
     
     {
     {
         orderDetail: {
         orderDetail: {
+            orderNum: '', //订单号
+
             name: '', //收货人姓名
             name: '', //收货人姓名
             phoneNum: '',
             phoneNum: '',
             address: '',
             address: '',

@@ -45,15 +45,13 @@
                 width: 140rem / $pxConvertRem;
                 width: 140rem / $pxConvertRem;
                 font-size: 24rem / $pxConvertRem;
                 font-size: 24rem / $pxConvertRem;
                 text-align: center;
                 text-align: center;
-            }
-
-            .cancel {
                 border: 1px solid #000;
                 border: 1px solid #000;
             }
             }
 
 
             .pay {
             .pay {
                 background: #d0021b;
                 background: #d0021b;
                 color: #fff;
                 color: #fff;
+                border: none;
                 margin-left: 20rem / $pxConvertRem;
                 margin-left: 20rem / $pxConvertRem;
             }
             }
         }
         }

 {{> layout/header}}
 {{> layout/header}}
 <div class="order-detail-page yoho-page">
 <div class="order-detail-page yoho-page">
     {{# orderDetail}}
     {{# orderDetail}}
-        <div id="order-detail" data-id="{{id}}">
+        <div id="order-detail" data-id="{{orderNum}}">
             <section class="owner-info block">
             <section class="owner-info block">
                 <span class="iconfont">&#xe631;</span>
                 <span class="iconfont">&#xe631;</span>
                 <div class="beside-icon">
                 <div class="beside-icon">

@@ -12,6 +12,7 @@
         共{{count}}件商品  实付<span class="sum-cost">¥{{sumCost}}</span>
         共{{count}}件商品  实付<span class="sum-cost">¥{{sumCost}}</span>
     </footer>
     </footer>
 
 
+    {{!-- 对应订单状态的操作逻辑 --}}
     {{#if unpaid}}
     {{#if unpaid}}
         <div class="order-opt">
         <div class="order-opt">
             <span class="btn cancel">取消订单</span>
             <span class="btn cancel">取消订单</span>
@@ -24,4 +25,22 @@
             <a class="check-logistics" href="{{.}}">查看物流</a>
             <a class="check-logistics" href="{{.}}">查看物流</a>
         </div>
         </div>
     {{/with}}
     {{/with}}
+
+    {{#with unshipped}}
+        <div class="order-opt">
+            <a class="check-logistics" href="{{.}}">查看物流</a>
+        </div>
+    {{/with}}
+
+    {{#if canceled}}
+        <div class="order-opt">
+            <span class="btn del">删除订单</span>
+        </div>
+    {{/if}}
+
+    {{#if completed}}
+        <div class="order-opt">
+            <span class="btn del">删除订单</span>
+        </div>
+    {{/if}}
 </div>
 </div>