订单接口相关

src/pages/benefits/index.vue

@@ -18,40 +18,33 @@
     </div>
     <div class="ptc-block">
       <div class="ptc-inner">
-        <!-- <div
+        <div
           v-for="(item, index) of info.rights"
           :key="index"
           class="benefit"
           :style="{ backgroundImage: `url(${item.icon})` }"
         >
-          <p class="benefit-name">{{ info.title }}</p>
-          <p class="benefit-desc">Avaliable 1</p>
-          <p class="benefit-sup">
-            Member price：<span class="highlight">$35</span>
-          </p>
-          <button v-if="info.button_type" class="ptc-button">
-            {{ info.button_name }}
-          </button>
-        </div> -->
-        <div class="benefit benefit-b">
-          <p class="benefit-name">Phone Health Inspection Service</p>
-          <p class="benefit-desc">Avaliable 1</p>
-          <p class="benefit-sup">Available after 2021/06/01</p>
-          <button class="ptc-button">Nearby shops</button>
-        </div>
-        <div class="benefit benefit-c">
-          <p class="benefit-name">Technical Support</p>
-          <p class="benefit-desc">Available throughout the year</p>
-          <button class="ptc-button">Contact us</button>
-        </div>
-        <div class="benefit benefit-d">
-          <p class="benefit-name">Birthday Gift</p>
+          <p class="benefit-name">{{ item.title }}</p>
           <p class="benefit-desc">
-            Pick up at the store in the month of your birthday, you can only
-            enjoy it once
+            {{ item.left_times ? `Available ${item.left_times}` : item.remark }}
           </p>
+          <p v-if="item.price || item.next_available_at" class="benefit-sup">
+            <template v-if="item.price">
+              Member price：<span class="highlight">${{ item.price }}</span>
+            </template>
+            <template v-else
+              >Available after {{ item.next_available_at }}</template
+            >
+          </p>
+          <button
+            v-if="item.button_name"
+            class="ptc-button"
+            @click="onClickButton(item.button_link)"
+          >
+            {{ item.button_name }}
+          </button>
         </div>
-        <div class="benefit benefit-e">
+        <!-- <div class="benefit benefit-e">
           <p class="benefit-name">Cleaning Kit</p>
           <p class="benefit-desc">Give a gift of XX</p>
           <button
@@ -65,7 +58,7 @@
           >
             Send to me
           </button>
-        </div>
+        </div> -->
       </div>
     </div>
   </div>
@@ -87,6 +80,11 @@ export default defineComponent({
       info: null,
     }
   },
+  methods: {
+    onClickButton(link) {
+      location.href = link
+    },
+  },
 })
 </script>
 
@@ -141,21 +139,21 @@ export default defineComponent({
     background-repeat: no-repeat;
     background-position: 0 0;
     background-size: 64px 64px;
-    &-a {
-      background-image: url(@img/benefit0.png);
-    }
-    &-b {
-      background-image: url(@img/benefit1.png);
-    }
-    &-c {
-      background-image: url(@img/benefit2.png);
-    }
-    &-d {
-      background-image: url(@img/benefit3.png);
-    }
-    &-e {
-      background-image: url(@img/benefit4.png);
-    }
+    // &-a {
+    //   background-image: url(@img/benefit0.png);
+    // }
+    // &-b {
+    //   background-image: url(@img/benefit1.png);
+    // }
+    // &-c {
+    //   background-image: url(@img/benefit2.png);
+    // }
+    // &-d {
+    //   background-image: url(@img/benefit3.png);
+    // }
+    // &-e {
+    //   background-image: url(@img/benefit4.png);
+    // }
 
     + .benefit {
       padding-top: 48px;

src/pages/mailing/index.vue

@@ -5,7 +5,7 @@
       <div class="ptc-wrapper">
         <div class="ptc-block">
           <div class="ptc-inner">
-            <div class="title">Receive merchandise：{{ right_name }} (1)</div>
+            <div class="title">Receive merchandise：{{ right_name }}</div>
             <div class="ptc-cell">
               <p class="ptc-label">Name</p>
               <p class="ptc-value">
@@ -99,6 +99,7 @@
 import { reactive, ref, watch } from 'vue'
 import { useRoute } from 'vue-router'
 import { applyPost } from '@/service/order'
+import Toast from '@/components/toast'
 
 const { right_id, right_name } = useRoute().query
 const step = ref(0)
@@ -107,6 +108,10 @@ const form: any = reactive({ address: [] })
 watch(step, () => window.scrollTo(0, 0))
 
 async function submit() {
+  if (!form.post_name) return Toast('Please enter your real name')
+  if (!form.post_phone) return Toast('Please enter your phone number')
+  if (!(form.address.length === 3 && form.address.every(Boolean)))
+    return Toast('Please enter your full address')
   await applyPost({
     member_right_id: right_id,
     post_name: form.post_name,

src/pages/my-order/index.vue

@@ -53,7 +53,7 @@
         </div>
         <div class="cell-group cell-group--compact">
           <template v-if="item.status < 2">
-            <div class="cell">
+            <div v-if="item.payment_open" class="cell">
               <span class="cell__label">Activation fee</span>
               <span class="cell__value">${{ item.payment_open }}</span>
             </div>
@@ -61,14 +61,14 @@
               <span class="cell__label">Membership fee</span>
               <span class="cell__value">${{ item.payment_product }}</span>
             </div>
-            <div class="cell">
+            <div v-if="item.discount_amount" class="cell">
               <span class="cell__label">Discount</span>
               <span class="cell__value highlight"
                 >-${{ item.discount_amount }}</span
               >
             </div>
           </template>
-          <div class="cell" :class="{ mt48: 1 }">
+          <div class="cell" :class="{ mt48: item.stauts < 2 }">
             <span class="cell__label">Cost</span>
             <span class="cell__value bold">${{ item.payment_amount }}</span>
           </div>
@@ -76,7 +76,9 @@
       </div>
       <div v-if="item.status !== 1" class="button-group">
         <template v-if="item.status === 0">
-          <button class="ptc-button">Pay 14:40</button>
+          <button class="ptc-button" @click="handlePay(item.stripe_pay_link)">
+            Pay 14:40
+          </button>
           <button
             class="ptc-button ptc-button--stroke"
             @click="cancelOrder(item)"
@@ -122,6 +124,10 @@ export default defineComponent({
       await api.deleteOrder(item.id)
       this.list.splice(this.list.indexOf(item), 1)
     },
+
+    handlePay(link) {
+      location.href = link
+    },
   },
 })
 </script>