plan：添加订单类型

src/request/api.ts

@@ -77,3 +77,5 @@ export const editWebhookStatus = (data: object, config: object) => put('/user-ap
 export const getBalanceRecordList = (params: object) => get('/user-api/v1/balance/getBalanceRecordList', params)
 // plan - 账户消费充值记录导出
 export const exportBalanceRecordList = (params: object, config: object) => getWithConfig('/user-api/v1/balance/exportBalanceRecordList', params, config)
+// plan - 套餐详情
+export const getPricingPlanList = () => get('/user-api/v1/balance/getBill', {})

src/views/billing/plan.vue

@@ -2,6 +2,12 @@
   <div class="plan container">
     <h1>Plan</h1>
     <Progress :init="true" />
+    <div v-for="(item, index) in PricingPlanList" :key="index" class="comb">
+      <div><span>Pricing Plan: </span>{{ item.assetTypeShow }}</div>
+      <div v-if="item.assetType === 1"><span>Up to: </span>{{ item.totalFiles }} Documents / {{ item.assetTypeShow }}</div>
+      <div v-else><span>Up to: </span>{{ item.totalFiles }}</div>
+      <div v-if="item.assetType !== 2"><span>Validity Period: </span>{{ item.startDate }} - {{item.endDate}}</div>
+    </div>
     <div class="block">
       <div class="top">
         <h2>Processing Files Balance</h2>
@@ -37,7 +43,7 @@
 import dayjs from 'dayjs'
 import { Component, Vue } from 'vue-property-decorator'
 import Progress from '@/components/progress/Progress.vue'
-import { getBalanceRecordList, exportBalanceRecordList } from '@/request/api'
+import { getBalanceRecordList, exportBalanceRecordList, getPricingPlanList } from '@/request/api'
 
 @Component({
   components: {
@@ -46,6 +52,7 @@ import { getBalanceRecordList, exportBalanceRecordList } from '@/request/api'
 })
 export default class Plan extends Vue {
   tableData:any = []
+  PricingPlanList:any = []
   pageSize = 8
   totalNum = 0
   currentPage = 1
@@ -57,6 +64,7 @@ export default class Plan extends Vue {
 
   created () {
     this.getPlanList(this.currentPage)
+    this.getPricingPlan()
   }
 
   // 获取plan列表数据
@@ -158,6 +166,32 @@ export default class Plan extends Vue {
       this.order = 1
     }
   }
+
+  // 获取套餐
+  getPricingPlan () {
+    getPricingPlanList().then((res:any) => {
+      if (res.code === '200') {
+        this.PricingPlanList = res.data
+        for (let i = 0; i < this.PricingPlanList.length; i++) {
+          if (this.PricingPlanList[i].assetType === 1) {
+            if (this.PricingPlanList[i].cycle === 1) {
+              this.PricingPlanList[i].assetTypeShow = 'Month'
+            } else if (this.PricingPlanList[i].cycle === 2) {
+              this.PricingPlanList[i].assetTypeShow = 'Year'
+            }
+          } else if (this.PricingPlanList[i].assetType === 2) {
+            this.PricingPlanList[i].assetTypeShow = 'Package'
+          } else if (this.PricingPlanList[i].assetType === 3) {
+            this.PricingPlanList[i].assetTypeShow = 'Free'
+          }
+        }
+        console.log(this.PricingPlanList)
+      }
+    }).catch(err => {
+      console.log(err)
+      this.$message.error('Failed to export.')
+    })
+  }
 }
 </script>
 
@@ -212,6 +246,21 @@ export default class Plan extends Vue {
       }
     }
   }
+  .comb{
+    margin-top: 24px;
+    margin-bottom: 20px;
+    padding: 20px 40px 24px;
+    background: #FFFFFF;
+    box-shadow: 0px 4px 35px rgba(129, 149, 200, 0.18);
+    border-radius: 16px;
+    text-align: left;
+    div + div{
+      margin-top: 8px;
+    }
+    span{
+      font-weight: 600;
+    }
+  }
 }
 @media screen and (max-width: 767px) {
   .plan .pagination {