TBtools-个人中心

htmldev/TBTools/src/views/modules/mine/user.vue

@@ -6,14 +6,9 @@
         <p>免费用户可以使用所有收费方式是免费的功能，包括淘宝词库、指数转换等功能。虽然免费，但是功能非常多哦！</p>
         <button class="default">免费注册</button>
       </router-link>
-      <a href="javascript:;">
-        <img src="../../../../static/img/mine/icon_1.png" alt="">
-        <p>会员用户可以使用所有收费方式是会员的功能，主要用于浏览器插件。</p>
-        <button class="primary">立即购买</button>
-      </a>
-      <a href="javascript:;">
-        <img src="../../../../static/img/mine/icon_2.png" alt="">
-        <p>积分用户可以使用所有收费方式是积分的功能，主要用于官网的积分消耗的功能！</p>
+      <a href="javascript:;" v-for="(item, index) in vipList" :key="index">
+        <img :src="item.vipImg" alt="">
+        <p>{{ item.vipDesc }}</p>
         <button class="primary">立即购买</button>
       </a>
     </el-col>
@@ -26,11 +21,34 @@ import Vue from 'vue'
 
 export default {
   name: 'user',
+  data () {
+    return {
+      vipList: []
+    }
+  },
   computed: {
     userPhone () {
       const userPhone = this.$store.state.user.userPhone || Vue.cookie.get('userPhone')
       return Crypto.decrypt(userPhone)
     }
+  },
+  created () {
+    this.funInit()
+  },
+  methods: {
+    funInit () {
+      this.$http({
+        url: this.$http.adornUrl('/user/viplist'),
+        method: 'get',
+        params: this.$http.adornParams({})
+      }).then(({ data }) => {
+        if (data.status) {
+          this.vipList = data.data
+        } else {
+          this.$message.error(data.msg)
+        }
+      })
+    }
   }
 }
 </script>