|
|
@@ -8,69 +8,71 @@
|
|
|
<template>
|
|
|
<div class="font-primary min-w-1200px">
|
|
|
<Navbar></Navbar>
|
|
|
- <div class="flex mt-50px px-[10%] mb-30px justify-between">
|
|
|
- <div class="w-[27%] min-w-260px px-24px pb-80px mb-20px bg-[#fafafa]">
|
|
|
- <div class="person">
|
|
|
- <div>
|
|
|
- <a href="/members/me/expenses" class="members">
|
|
|
- <img :src="userInfo.avatarUrl" class="userCenterAvatarUrl">
|
|
|
- </a>
|
|
|
- <br>
|
|
|
- <p class="username">{{userInfo?.name}}</p>
|
|
|
- <p class="user-showname block mt-16px">{{userInfo?.email || userInfo?.phone}}</p>
|
|
|
- </div>
|
|
|
- <div class="flex py-14px mt-20px justify-between text-left">
|
|
|
+ <div class="min-h-1572px">
|
|
|
+ <div class="flex mt-50px px-[10%] mb-30px justify-between">
|
|
|
+ <div class="w-[27%] min-w-260px px-24px pb-80px mb-20px bg-[#fafafa]">
|
|
|
+ <div class="person">
|
|
|
<div>
|
|
|
- <p v-if="userInfo?.subscriberType === 1" class="user-vip text-18px mb-6px text-[#333] font-500 leading-24px">17会员</p>
|
|
|
- <p v-else class="text-18px text-[#333] font-500 leading-24px mb-6px">免费用户</p>
|
|
|
- <p v-if="userInfo?.subscriberType === 1" class="text-12px text-[#999] pl-28px mb-6px leading-17px">剩余<span class="text-bg-$btn-color-primary">{{userInfo?.day}}</span>天到期</p>
|
|
|
- <p v-else class="text-12px text-[#999] leading-17px">订阅会员免费格式转换</p>
|
|
|
+ <a href="/members/me/expenses" class="members">
|
|
|
+ <img :src="userInfo.avatarUrl" class="userCenterAvatarUrl">
|
|
|
+ </a>
|
|
|
+ <br>
|
|
|
+ <p class="username">{{userInfo?.name}}</p>
|
|
|
+ <p class="user-showname block mt-16px">{{userInfo?.email || userInfo?.phone}}</p>
|
|
|
</div>
|
|
|
- <button class="btn-renew" @click="handlerBuy('vip')">
|
|
|
- {{userInfo?.subscriberType === 1 ? '续费' : '订阅会员'}}
|
|
|
- </button>
|
|
|
- </div>
|
|
|
- <div class="flex py-14px my-8px justify-between text-left">
|
|
|
- <div class="user-ticket">
|
|
|
- <p class="text-18px text-[#333] leading-24px mb-6px">
|
|
|
- <span class="font-500 text-bg-$btn-color-primary text-18px leading-24px tracking-1px">
|
|
|
- {{userInfo?.points}}
|
|
|
- </span>
|
|
|
- <span class="text-bg-$btn-color-primary text-14px leading-18px">
|
|
|
- 张
|
|
|
- </span>
|
|
|
- <span class="text-14px text-[rgba(0,0,0,0.8)] leading-18px">
|
|
|
- /{{userInfo?.totalPoints}}张
|
|
|
- </span>
|
|
|
- </p>
|
|
|
- <p class="text-12px text-[#999] leading-17px">转换券</p>
|
|
|
+ <div class="flex py-14px mt-20px justify-between text-left">
|
|
|
+ <div>
|
|
|
+ <p v-if="userInfo?.subscriberType === 1" class="user-vip text-18px mb-6px text-[#333] font-500 leading-24px">17会员</p>
|
|
|
+ <p v-else class="text-18px text-[#333] font-500 leading-24px mb-6px">免费用户</p>
|
|
|
+ <p v-if="userInfo?.subscriberType === 1" class="text-12px text-[#999] pl-28px mb-6px leading-17px">剩余<span class="text-bg-$btn-color-primary">{{userInfo?.day}}</span>天到期</p>
|
|
|
+ <p v-else class="text-12px text-[#999] leading-17px">订阅会员免费格式转换</p>
|
|
|
+ </div>
|
|
|
+ <button class="btn-renew" @click="handlerBuy('vip')">
|
|
|
+ {{userInfo?.subscriberType === 1 ? '续费' : '订阅会员'}}
|
|
|
+ </button>
|
|
|
+ </div>
|
|
|
+ <div class="flex py-14px my-8px justify-between text-left">
|
|
|
+ <div class="user-ticket">
|
|
|
+ <p class="text-18px text-[#333] leading-24px mb-6px">
|
|
|
+ <span class="font-500 text-bg-$btn-color-primary text-18px leading-24px tracking-1px">
|
|
|
+ {{userInfo?.points}}
|
|
|
+ </span>
|
|
|
+ <span class="text-bg-$btn-color-primary text-14px leading-18px">
|
|
|
+ 张
|
|
|
+ </span>
|
|
|
+ <span class="text-14px text-[rgba(0,0,0,0.8)] leading-18px">
|
|
|
+ /{{userInfo?.totalPoints}}张
|
|
|
+ </span>
|
|
|
+ </p>
|
|
|
+ <p class="text-12px text-[#999] leading-17px">转换券</p>
|
|
|
+ </div>
|
|
|
+ <button class="btn-recharge" @click="handlerBuy('ticket')">充值</button>
|
|
|
</div>
|
|
|
- <button class="btn-recharge" @click="handlerBuy('ticket')">充值</button>
|
|
|
</div>
|
|
|
+
|
|
|
+ <ul class="menus-ul">
|
|
|
+ <li class="my_convert" :class="{active: $route.path === '/members/me/expenses'}">
|
|
|
+ <nuxt-link to="/members/me/expenses" class='myexpenses'>我的转档</nuxt-link>
|
|
|
+ </li>
|
|
|
+ <li class='my_pricing' :class="{active: showBuy || $route.path === '/members/me/points' || $route.path === '/members/me/vip'}">
|
|
|
+ <a @click="showBuy = !showBuy">消费记录</a>
|
|
|
+ <ul :class="{active: showBuy || $route.path === '/members/me/points' || $route.path === '/members/me/vip'}">
|
|
|
+ <li >
|
|
|
+ <nuxt-link :class="{active: $route.path === '/members/me/vip'}" to="/members/me/vip" class='mypoints text-[16px]'>
|
|
|
+ 会员购买
|
|
|
+ </nuxt-link>
|
|
|
+ </li>
|
|
|
+ <li >
|
|
|
+ <nuxt-link :class="{active: $route.path === '/members/me/points'}" to="/members/me/points" class='mypoints'>
|
|
|
+ 转换券购买
|
|
|
+ </nuxt-link>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
</div>
|
|
|
-
|
|
|
- <ul class="menus-ul">
|
|
|
- <li class="my_convert" :class="{active: $route.path === '/members/me/expenses'}">
|
|
|
- <nuxt-link to="/members/me/expenses" class='myexpenses'>我的转档</nuxt-link>
|
|
|
- </li>
|
|
|
- <li class='my_pricing' :class="{active: showBuy || $route.path === '/members/me/points' || $route.path === '/members/me/vip'}">
|
|
|
- <a @click="showBuy = !showBuy">消费记录</a>
|
|
|
- <ul :class="{active: showBuy || $route.path === '/members/me/points' || $route.path === '/members/me/vip'}">
|
|
|
- <li >
|
|
|
- <nuxt-link :class="{active: $route.path === '/members/me/vip'}" to="/members/me/vip" class='mypoints text-[16px]'>
|
|
|
- 会员购买
|
|
|
- </nuxt-link>
|
|
|
- </li>
|
|
|
- <li >
|
|
|
- <nuxt-link :class="{active: $route.path === '/members/me/points'}" to="/members/me/points" class='mypoints'>
|
|
|
- 转换券购买
|
|
|
- </nuxt-link>
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
+ <Nuxt class="w-[70%]"></Nuxt>
|
|
|
</div>
|
|
|
- <Nuxt class="w-[70%]"></Nuxt>
|
|
|
</div>
|
|
|
<FooterBar></FooterBar>
|
|
|
</div>
|
