更新：增加课程和图书VIP购买及“我的”主页vip身份显示

pages/user/index.vue

@@ -23,25 +23,28 @@
 		<!-- VIP订阅卡片 -->
 		<view class="vip-card-section">
 			<view class="vip-card">
-				用户VIP功能重写中。。。
-				<!-- <view v-if="vipInfo.id" class="vip-info">
-          <text class="label">{{ $t('user.vip') }}</text>
-          <text class="value">{{ vipInfo.endTime ? vipInfo.endTime.split(' ')[0] : '' }}</text>
-        </view>
-        <wd-button 
-          v-else 
-          type="success"
-          size="small"
-          @click="goSubscribe"
-        >
-          {{ $t('user.subscribe') }}
-        </wd-button> -->
+				<view class="vip-card-title">{{ $t('user.vip') }}</view>
+				<view class="vip-card-content">
+					<view class="vip-item-list">
+						<view v-if="vipInfo.length > 0" v-for="vip in vipInfo">{{ vipTypeDict[vip.type] }}（有效期到 {{ parseTime(vip.endTime, '{y}-{m}-{d}') }}）</view>
+						<view v-else>办理课程VIP，畅享更多权益</view>
+					</view>
+					<wd-button v-if="vipInfo.length > 0" plain type="primary" size="small" @click="goSubscribe">{{ $t('vip.renewal') }}</wd-button>
+					<wd-button v-else plain type="primary" size="small" @click="goSubscribe">{{ $t('vip.openVip') }}</wd-button>
+				</view>
+				<view class="vip-card-content">
+					<view class="vip-item-list">
+						<view v-if="vipInfoEbook.length > 0" v-for="vip in vipInfoEbook">电子书VIP{{ vipTypeDict[vip.type] }}（有效期到 {{ parseTime(vip.endTime, '{y}-{m}-{d}') }}）</view>
+						<view v-else>办理电子书VIP，畅享更多权益</view>
+					</view>
+					<wd-button v-if="!vipInfoEbook.length" plain type="primary" size="small" @click="goSubscribe">{{ $t('vip.openVip') }}</wd-button>
+				</view>
 			</view>
 		</view>
 
 		<!-- 我的资产 -->
-		<view class="vip-card-section wallet-section">
-			<view class="vip-card wallet_l">
+		<view class="assets-card-section wallet-section">
+			<view class="assets-card wallet_l">
 				<view class="assets">
 					<view @click="goVirtualList">
 						<view class="assets_row">{{ t('global.coin') }}</view>
@@ -77,13 +80,15 @@
 <script setup lang="ts">
 	import { ref, computed, onMounted } from 'vue'
 	import { useUserStore } from '@/stores/user'
+	import { useSysStore } from '@/stores/sys'
 	import { getUserInfo, getVipInfo } from '@/api/modules/user'
 	import type { IVipInfo } from '@/types/user'
-	import { useI18n } from 'vue-i18n'
 	import { getNotchHeight } from '@/utils/system'
+	import { parseTime } from '@/utils/index'
+	import { t } from '@/utils/i18n'
 
-	const { t } = useI18n()
 	const userStore = useUserStore()
+	const sysStore = useSysStore()
 
 	// 默认头像
 	const defaultAvatar = '/static/home_icon.png'
@@ -92,11 +97,11 @@
 	const userInfo = computed(() => userStore.userInfo)
 
 	// VIP信息
-	const vipInfo = ref<IVipInfo>({
-		id: 0,
-		endTime: '',
-		vipType: 0
-	})
+	const vipInfo = computed(() => userStore.userVips)
+	const vipInfoEbook = computed(() => userStore.userEbookVip)
+		
+	// VIP类型字典
+	const vipTypeDict = sysStore.vipTypeDict
 
 	// 平台信息
 	const platform = ref('')
@@ -148,16 +153,9 @@
 	 */
 	const getData = async () => {
 		// 获取用户信息
-		const userRes = await getUserInfo()
-		console.log(userRes);
-		if (userRes.user) {
-			userStore.setUserInfo(userRes.user)
-		}
-
-		// 获取VIP信息
-		const vipRes = await getVipInfo()
-		if (vipRes.vipInfo) {
-			vipInfo.value = vipRes.vipInfo
+		const userInfoRes = await getUserInfo()
+		if (userInfoRes.result) {
+			userStore.setUserInfo(userInfoRes.result)
 		}
 	}
 
@@ -184,7 +182,7 @@
 	 */
 	const goSubscribe = () => {
 		uni.navigateTo({
-			url: '/pages/user/wallet/index'
+			url: '/pages/vip/book'
 		})
 	}
 
@@ -298,12 +296,47 @@
 		}
 	}
 
+	// vip 卡片
 	.vip-card-section {
 		padding: 0 20rpx;
 		margin-bottom: 20rpx;
+
+		.vip-card {
+			background: linear-gradient(135deg, #3E7EF5 0%, #9134EA 100%);
+			border-radius: 15rpx;
+			padding: 26rpx 30rpx 10rpx;
+			box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
+			
+			.vip-card-title {
+				font-size: 32rpx;
+				color: #fff;
+				font-weight: bold;
+				margin-bottom: 20rpx;
+			}
+			
+			.vip-card-content {
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+				background-color: rgba(255, 255, 255, 0.2);
+				border-radius: 8px;
+				padding: 30rpx;
+				margin-bottom: 20rpx;
+			}
+			.vip-item-list {
+				font-size: 28rpx;
+				color: #fff;
+				font-weight: bold;
+			}
+		}
+	}
+
+	.assets-card-section {
+		padding: 0 20rpx;
+		margin-bottom: 20rpx;
 	}
 
-	.vip-card {
+	.assets-card {
 		background: #fff;
 		border-radius: 15rpx;
 		padding: 40rpx;
@@ -312,7 +345,7 @@
 		justify-content: space-between;
 		box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
 
-		.vip-info {
+		.assets-info {
 			text-align: center;
 
 			.label {