积分兑换

src/project/pidu/AppPointsChange/order.vue

@@ -2,14 +2,14 @@
   <div class="order">
     <div class="goods">
       <div class="left">
-        <img src="./components/imgs/check-icon.png" alt="">
+        <img :src="goodsInfo.imageUrl" alt="">
       </div>
       <div class="right">
-        <p>天薇抽纸天然无香纸巾天薇抽纸天然无香纸巾天薇抽纸可湿水面巾纸1天薇抽纸天</p>
+        <p>{{goodsInfo.merchandiseName}}</p>
         <div class="flex">
-          <h3>10<span>积分</span></h3>
+          <h3>{{goodsInfo.merchandiseIntegral}}<span>积分</span></h3>
           <div class="num">
-            <u-number-box v-model="value" @change="valChange" :min="1" :max="200"></u-number-box>
+            <u-number-box v-model="number" @change="valChange" :min="1" :max="max"></u-number-box>
           </div>
         </div>
       </div>
@@ -22,11 +22,11 @@
     </div>
     <div class="flex-item border">
       <div class="label">积分余额</div>
-      <div class="value color-333">484</div>
+      <div class="value color-333">{{userIntegral}}</div>
     </div>
     <div class="flex-item">
       <div class="label">支付积分</div>
-      <div class="value color-ff6900">-10</div>
+      <div class="value color-ff6900">-{{number*goodsInfo.merchandiseIntegral}}</div>
     </div>
     <div class="footer">
       <div>提交订单</div>
@@ -41,20 +41,38 @@ export default {
   name: 'order',
   data() {
     return {
-      value: 1,
-      remark: ''
+      number: 1,
+      remark: '',
+      userIntegral: '',
+      id: '',
+      goodsInfo: {},
+      max: 1
     }
   },
   computed: {
     ...mapState(['user']),
   },
+  onLoad(option) {
+    this.userIntegral = option.userIntegral
+    this.id = option.id
+    this.getDetail()
+  },
   onShow() {
     document.title = '提交订单'
   },
   methods: {
     valChange(e) {
-      console.log('当前值为: ' + e.value)
-    }
+      this.number = e.value
+
+    },
+    getDetail() {
+      this.$http.post(`/app/appintegralmerchandise/queryDetailById?id=${this.id}`).then((res) => {
+        if (res.code == 0) {
+          this.goodsInfo = res.data
+          this.max = parseInt(this.userIntegral/this.goodsInfo.merchandiseIntegral)
+        }
+      })
+    },
   },
 }
 </script>