金额单位 分->元

src/utils/globalFilters.ts

@@ -3,6 +3,10 @@ import moment from 'moment'
 
 // 注册全局过滤器
 
+Vue.filter('fen2Yuan', function (v) {
+  return v / 100
+})
+
 // 金额大写，链接：https://juejin.im/post/5a2a7a5051882535cd4abfce
 // upDigit(1682)
 // result："人民币壹仟陆佰捌拾贰元整"

src/views/buy/Buy.vue

@@ -67,14 +67,14 @@
           <span class="price-t-label">支付金额：</span>
           <span class="price-t-count-now">
             <span class="cn-l">&yen;</span>
-            <span class="cn-r">{{ orderInfo.price }}</span>
+            <span class="cn-r">{{ orderInfo.price | fen2Yuan }}</span>
           </span>
         </div>
         <div class="price-bottom">
           <span class="price-b-label">原价：</span>
           <span class="price-b-count-o">
             <span class="co-l">&yen;</span>
-            <span class="co-r">{{ orderInfo.before_price }}</span>
+            <span class="co-r">{{ orderInfo.before_price | fen2Yuan }}</span>
           </span>
         </div>
       </div>

src/views/order/detail.vue

@@ -39,7 +39,7 @@
         <div>
           <div class="header-pic" :class="orderStateMap[orderInfo.state].bgcClassName">
             <div class="order-state">{{ orderStateMap[orderInfo.state].text }}</div>
-            <div class="surplus-time" v-if="orderStateMap[orderInfo.state].surplusTimeShow">
+            <div class="surplus-time" v-if="orderStateMap[orderInfo.state].surplusTimeShow && orderInfo.surplusTime">
               <span>剩余支付时间：</span>
               <van-count-down @finish="onCountdowFinish" :time="orderInfo.surplusTime * 1000" />
             </div>
@@ -89,15 +89,15 @@
                 <span class="card-item-l">下单时间：</span>
                 <span class="card-item-r">{{ orderInfo.createTime * 1000 | dateFormatter('yyyy/MM/dd HH:mm:ss') }}</span>
               </div>
-              <div class="j-card-item">
+              <div class="j-card-item" v-if="orderInfo.payTime">
                 <span class="card-item-l">支付时间：</span>
                 <span class="card-item-r">{{ orderInfo.payTime * 1000 | dateFormatter('yyyy/MM/dd HH:mm:ss') }}</span>
               </div>
-              <div class="j-card-item">
+              <div class="j-card-item" v-if="orderInfo.payWay">
                 <span class="card-item-l">支付方式：</span>
                 <span class="card-item-r">{{ payWayMap[orderInfo.payWay] }}</span>
               </div>
-              <div class="j-card-item">
+              <div class="j-card-item" v-if="orderInfo.paymentId">
                 <span class="card-item-l">支付单号：</span>
                 <span class="card-item-r">{{ orderInfo.paymentId }}</span>
               </div>
@@ -107,7 +107,7 @@
               </div>
               <div class="j-card-item">
                 <span class="card-item-l">支付金额：</span>
-                <span class="card-item-r">&yen; {{ orderInfo.payMoney }}</span>
+                <span class="card-item-r">&yen; {{ orderInfo.payMoney | fen2Yuan }}</span>
               </div>
             </div>
           </div>
@@ -195,7 +195,7 @@ export default class OrderDetail extends Vue {
   productInfo = {
     picImg: '',
     productName: '',
-    email: 'a@qq.com',
+    email: '',
     phone: '',
     entName: '',
     releaseTime: ''
@@ -204,13 +204,13 @@ export default class OrderDetail extends Vue {
   orderInfo = {
     // 0:待支付 1:已完成 -2:已取消
     state: 0,
-    ordercode: '12365652',
+    ordercode: '',
     createTime: '',
     payTime: 0,
-    payWay: 'wx_js',
+    payWay: '',
     paymentId: '',
     productType: '',
-    payMoney: '222',
+    payMoney: '',
     // 单位: 秒(s)
     surplusTime: null
     // surplusTime: 60 * 60 * 24 * 3
@@ -238,8 +238,8 @@ export default class OrderDetail extends Vue {
       duration: 0
     })
     this.getOrderDetail({ ordercode: this.ordercode, all: 1 }).then(res => {
-      this.loading = false
       if (res.error_code === 0) {
+        this.loading = false
         toast.clear()
         if (res.data && Object.keys(res.data).length !== 0) {
           // this.productInfo = res.data.productInfo
@@ -261,10 +261,8 @@ export default class OrderDetail extends Vue {
   }
 
   onCountdowFinish () {
-    console.log('onCountdowFinish')
-    this.getInfo()
-    // 倒计时结束，状态改为已取消
-    // this.orderInfo.state = -2
+    // console.log('onCountdowFinish')
+    // this.getInfo()
   }
 
   onConfirm () {
@@ -378,6 +376,7 @@ export default class OrderDetail extends Vue {
       box-sizing: border-box;
 
       // 头部使用header-mask实现
+      // 参考: https://www.sunzhongwei.com/css-div-arc-at-bottom
       &>div {
         position: relative;
         z-index: 2;
@@ -385,10 +384,10 @@ export default class OrderDetail extends Vue {
       &:after {
         content: '';
         width: 140%;
-        height: 220px;
+        height: 230px;
         position: absolute;
         left: 50%;
-        top:0;
+        top: -10px;
         background: url(~@/assets/image/order-detail-header-mask3x.png) no-repeat top center;
         background-size: contain;
         border-radius: 0 0 50% 50%;

src/views/pay/Pay.vue

@@ -5,7 +5,7 @@
         <span class="info-text">需支付金额</span>
         <span class="price-count">
           <span class="pc-l">&yen;</span>
-          <span class="pc-r">{{ orderInfo.payMoney }}</span>
+          <span class="pc-r">{{ orderInfo.payMoney | fen2Yuan }}</span>
         </span>
       </div>
       <van-radio-group v-model="payWay">

src/views/pay/PaySuccess.vue

@@ -6,7 +6,7 @@
         <span class="pay-text">支付成功</span>
         <span class="pay-count">
           <span class="pc-l">&yen;</span>
-          <span class="pc-r">{{ orderInfo.payMoney }}</span>
+          <span class="pc-r">{{ orderInfo.payMoney | fen2Yuan }}</span>
         </span>
         <p class="pay-text-desc">我们会尽快将数据报告发送至</p>
         <p class="pay-text-desc">{{ orderInfo.email }}</p>
@@ -29,7 +29,7 @@ import { mapActions } from 'vuex'
 import { dateFormatter } from '@/utils/globalFunctions.ts'
 
 @Component({
-  name: 'pay',
+  name: 'pay-success',
   components: {
     [Cell.name]: Cell,
     [CellGroup.name]: CellGroup