250323

src/package/user/card.vue

@@ -1,13 +1,13 @@
 <template>
   <view>
-
+    <uv-tabs :list="list" :current="cardType" :scrollable="false" @click="changeCardType"></uv-tabs>
     <view class="card-list">
       <block v-if="!hideTools || cardList.length > 0">
         <view
           class="container"
           v-for="(item, index) in cardList"
           :key="index"
-          @click="openUrl('/package/user/card-detail?cardId=' + item.id)"
+          @click="toDetail(item.id)"
           :style="{ background: `url(https://oss.wsdns.cn/20240920/5e3327e1ad97472e942c824ab1776f52.jpg?x-oss-process=image/resize,m_fixed,w_750/quality,Q_90) no-repeat center center`, backgroundSize: '100%', opacity: '0.85' }"
         >
           <view class="content web-cell">
@@ -34,7 +34,8 @@
                     item.remainingMoney
                   }}
                 </view>
-                <view class="desc web-text-heading" v-if="item.type === 1 || item.type === 3" style="color: #ffffff; font-size: 14px">
+                <view class="desc web-text-heading" v-if="item.type === 1 || item.type === 3"
+                      style="color: #ffffff; font-size: 14px">
                   {{ dayjs(item.expireTime * 1000).format('YYYY-MM-DD HH:mm') }}过期
                 </view>
               </view>
@@ -78,6 +79,8 @@
 import * as Api from '@/api/think/thinkUsersVip';
 import {getWeek, getKey} from '@/utils/common';
 import dayjs from "dayjs";
+import {listThinkUsersVip, pageThinkUsersVip} from "@/api/think/thinkUsersVip";
+import {listThinkCard, listUserThinkCard, pageThinkCard} from "@/api/think/thinkCard";
 
 export default {
   components: {},
@@ -86,12 +89,14 @@ export default {
       isRefresh: false,
       isLogin: false,
       userId: 0,
+      cardType: 0,
       where: {
         page: 1
       },
       canReset: false,
       loadMore: 'more',
       logo: '',
+      list: [{name: 'VIP卡'}, {name: 'IC卡'}],
       items: ['月/年卡', '次卡', '充值卡'],
       cardList: [],
       styles: [
@@ -129,9 +134,11 @@ export default {
     console.log('判断是否刷新: ', e);
     // 判断是否登录
     this.openLogin();
-    if (this.isRefresh) {
-      this.reload();
-    }
+    // if (this.isRefresh) {
+    //   this.reload();
+    // }
+    this.cardType = 0
+    this.getVipCardList()
   },
   // 触底函数
   onReachBottom() {
@@ -144,6 +151,22 @@ export default {
   },
   methods: {
     dayjs,
+    changeCardType({index}) {
+      this.cardType = index
+      this.cardList = []
+      if (index === 0) {
+        this.getVipCardList()
+      } else {
+        this.getIcCardList()
+      }
+    },
+    async getVipCardList() {
+      this.cardList = await listThinkUsersVip()
+    },
+    async getIcCardList() {
+      this.cardList = await listUserThinkCard()
+    },
+
     reload() {
       const app = this;
       const {where, userId} = this;
@@ -251,6 +274,12 @@ export default {
         this.$refs.login.open('bottom');
         return false;
       }
+    },
+    toDetail(id) {
+      if (this.cardType === 0)
+        this.openUrl(`/package/user/card-detail?cardId=${id}`)
+      else
+        this.openUrl(`/package/user/ic-card-detail?cardId=${id}`)
     }
   }
 };