付费升级代理页面修改

This commit is contained in:
2025-12-16 19:28:00 +08:00
parent 430b8f12ba
commit bceca129be

View File

@@ -7,8 +7,30 @@
{{ getLevelName(level) }} {{ getLevelName(level) }}
</div> </div>
<div class="flex-1"> <div class="flex-1">
<p class="text-lg font-bold" style="color: var(--van-text-color);">当前等级</p> <div class="flex justify-between items-start gap-2">
<p class="text-sm mt-1" style="color: var(--van-text-color-2);">{{ getLevelDesc(level) }}</p> <div>
<p class="text-lg font-bold" style="color: var(--van-text-color);">当前等级</p>
<p class="text-sm mt-1" style="color: var(--van-text-color-2);">{{ getLevelDesc(level) }}
</p>
</div>
<!-- 当前等级权益展示与标题并排 -->
<div v-if="getPrivilegeInfo(level)" class="space-y-1 text-sm text-right"
style="color: var(--van-text-color);">
<div class="flex items-center gap-1 justify-end">
<span>设置查询价最高{{ getPrivilegeInfo(level).max_set_price }}</span>
<van-icon name="checked" size="14" color="#f59e0b" />
</div>
<div class="flex items-center gap-1 justify-end">
<span>邀请黄金代理奖励{{ getPrivilegeInfo(level).invite_gold_reward }}</span>
<van-icon name="checked" size="14" color="#f59e0b" />
</div>
<div class="flex items-center gap-1 justify-end">
<span>邀请钻石代理奖励{{ getPrivilegeInfo(level).invite_diamond_reward }}</span>
<van-icon name="checked" size="14" color="#f59e0b" />
</div>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
@@ -33,26 +55,35 @@
</div> </div>
</div> </div>
<div v-if="getPrivilegeInfo(2)" class="space-y-2"> <div v-if="getPrivilegeInfo(2)" class="space-y-2">
<!-- 底价降低 --> <!-- 设置查询价最高 -->
<div class="flex items-center gap-2 text-sm" style="color: var(--van-text-color-2);"> <div class="flex items-center gap-2 text-sm" style="color: var(--van-text-color);">
<van-icon name="checked" size="14" color="#f59e0b" /> <van-icon name="checked" size="14" color="#f59e0b" />
<span>底价降低¥{{ getPriceReduction(2) }}</span> <span>设置查询价最高{{ getPrivilegeInfo(2).max_set_price }}</span>
</div> </div>
<!-- 推广返佣 --> <!-- 查询底价降低 -->
<div class="flex items-center gap-2 text-sm" style="color: var(--van-text-color-2);"> <div class="flex items-center gap-2 text-sm" style="color: var(--van-text-color);">
<van-icon name="checked" size="14" color="#f59e0b" /> <van-icon name="checked" size="14" color="#f59e0b" />
<span>{{ getPrivilegeInfo(2).promote_rebate }}</span> <span>查询底价降低{{ formatAmount(getPrivilegeInfo(2).price_reduction) }}元每单</span>
</div> </div>
<!-- 下级升级返佣 --> <!-- 下级代理查询奖励最高 -->
<div class="flex items-center gap-2 text-sm" style="color: var(--van-text-color-2);"> <div class="flex items-center gap-2 text-sm" style="color: var(--van-text-color);">
<van-icon name="checked" size="14" color="#f59e0b" /> <van-icon name="checked" size="14" color="#f59e0b" />
<span>{{ getPrivilegeInfo(2).upgrade_rebate }}</span> <span>下级代理查询奖励最高{{ getPrivilegeInfo(2).subordinate_reward_max }}元每单</span>
</div> </div>
<!-- 特权列表 --> <!-- 邀请黄金代理奖励 -->
<div v-for="(privilege, index) in getPrivilegeInfo(2).privileges" :key="index" <div class="flex items-center gap-2 text-sm" style="color: var(--van-text-color);">
class="flex items-center gap-2 text-sm" style="color: var(--van-text-color-2);">
<van-icon name="checked" size="14" color="#f59e0b" /> <van-icon name="checked" size="14" color="#f59e0b" />
<span>{{ privilege }}</span> <span>邀请黄金代理奖励{{ getPrivilegeInfo(2).invite_gold_reward }}</span>
</div>
<!-- 邀请钻石代理奖励 -->
<div class="flex items-center gap-2 text-sm" style="color: var(--van-text-color);">
<van-icon name="checked" size="14" color="#f59e0b" />
<span>邀请钻石代理奖励{{ getPrivilegeInfo(2).invite_diamond_reward }}</span>
</div>
<!-- 更多权益 -->
<div class="flex items-center gap-2 text-sm" style="color: var(--van-text-color);">
<van-icon name="checked" size="14" color="#f59e0b" />
<span>更多权益敬请期待</span>
</div> </div>
</div> </div>
</div> </div>
@@ -73,26 +104,50 @@
</div> </div>
</div> </div>
<div v-if="getPrivilegeInfo(3)" class="space-y-2"> <div v-if="getPrivilegeInfo(3)" class="space-y-2">
<!-- 底价降低 --> <!-- 升级费用 -->
<div class="flex items-center gap-2 text-sm" style="color: var(--van-text-color-2);"> <div class="flex items-center gap-2 text-sm" style="color: var(--van-text-color);">
<van-icon name="checked" size="14" color="#f59e0b" /> <van-icon name="checked" size="14" color="#f59e0b" />
<span>底价降低¥{{ getPriceReduction(3) }}</span> <span>升级费用¥{{ formatAmount(getUpgradeInfo(3).upgradeFee) }}</span>
</div> </div>
<!-- 推广返佣 --> <!-- 设置查询价最高 -->
<div class="flex items-center gap-2 text-sm" style="color: var(--van-text-color-2);"> <div class="flex items-center gap-2 text-sm" style="color: var(--van-text-color);">
<van-icon name="checked" size="14" color="#f59e0b" /> <van-icon name="checked" size="14" color="#f59e0b" />
<span>{{ getPrivilegeInfo(3).promote_rebate }}</span> <span>设置查询价最高{{ getPrivilegeInfo(3).max_set_price }}</span>
</div> </div>
<!-- 下级升级返佣 --> <!-- 查询底价降低 -->
<div class="flex items-center gap-2 text-sm" style="color: var(--van-text-color-2);"> <div class="flex items-center gap-2 text-sm" style="color: var(--van-text-color);">
<van-icon name="checked" size="14" color="#f59e0b" /> <van-icon name="checked" size="14" color="#f59e0b" />
<span>{{ getPrivilegeInfo(3).upgrade_rebate }}</span> <span>查询底价降低{{ formatAmount(getPrivilegeInfo(3).price_reduction) }}元每单</span>
</div> </div>
<!-- 特权列表 --> <!-- 下级代理查询奖励最高 -->
<div v-for="(privilege, index) in getPrivilegeInfo(3).privileges" :key="index" <div class="flex items-center gap-2 text-sm" style="color: var(--van-text-color);">
class="flex items-center gap-2 text-sm" style="color: var(--van-text-color-2);">
<van-icon name="checked" size="14" color="#f59e0b" /> <van-icon name="checked" size="14" color="#f59e0b" />
<span>{{ privilege }}</span> <span>下级代理查询奖励最高{{ getPrivilegeInfo(3).subordinate_reward_max }}元每单</span>
</div>
<!-- 邀请黄金代理奖励 -->
<div class="flex items-center gap-2 text-sm" style="color: var(--van-text-color);">
<van-icon name="checked" size="14" color="#f59e0b" />
<span>邀请黄金代理奖励{{ getPrivilegeInfo(3).invite_gold_reward }}</span>
</div>
<!-- 邀请钻石代理奖励 -->
<div class="flex items-center gap-2 text-sm" style="color: var(--van-text-color);">
<van-icon name="checked" size="14" color="#f59e0b" />
<span>邀请钻石代理奖励{{ getPrivilegeInfo(3).invite_diamond_reward }}</span>
</div>
<!-- 调整下级代理级别权限 -->
<div class="flex items-center gap-2 text-sm" style="color: var(--van-text-color);">
<van-icon name="checked" size="14" color="#f59e0b" />
<span>调整下级代理级别权限</span>
</div>
<!-- 系统内白名单权限 -->
<div class="flex items-center gap-2 text-sm" style="color: var(--van-text-color);">
<van-icon name="checked" size="14" color="#f59e0b" />
<span>系统内白名单权限</span>
</div>
<!-- 更多权益 -->
<div class="flex items-center gap-2 text-sm" style="color: var(--van-text-color);">
<van-icon name="checked" size="14" color="#f59e0b" />
<span>更多权益敬请期待</span>
</div> </div>
</div> </div>
</div> </div>
@@ -302,13 +357,11 @@ const getPrivilegeInfo = (targetLevel) => {
return levelPrivileges.value.find(p => p.level === targetLevel) return levelPrivileges.value.find(p => p.level === targetLevel)
} }
// 计算底价降低(使用后端返回的值) // 数值格式化,统一保留整数金额
const getPriceReduction = (targetLevel) => { const formatAmount = (value) => {
const privilegeInfo = levelPrivileges.value.find(p => p.level === targetLevel) const num = Number(value || 0)
if (privilegeInfo && privilegeInfo.price_reduction > 0) { if (Number.isNaN(num)) return '0'
return privilegeInfo.price_reduction.toFixed(0) return num.toFixed(0)
}
return '0'
} }
// 加载特权信息 // 加载特权信息
@@ -328,8 +381,11 @@ const loadPrivilegeInfo = async () => {
} }
// 联系客服 // 联系客服
const serviceUrl = import.meta.env.VITE_SERVICE_URL || '';
const toService = () => { const toService = () => {
window.location.href = "https://work.weixin.qq.com/kfid/kfc82d4424e4b19e5f3" if (serviceUrl) {
window.location.href = serviceUrl;
}
} }
onMounted(() => { onMounted(() => {