388 lines
24 KiB
Vue
388 lines
24 KiB
Vue
<script setup>
|
||
import { storeToRefs } from 'pinia'
|
||
import { useAgentStore } from '@/stores/agentStore'
|
||
import { useUserStore } from '@/stores/userStore'
|
||
|
||
definePage({
|
||
layout: 'PageLayout',
|
||
style: {
|
||
navigationBarTitleText: '代理系统指南',
|
||
navigationStyle: 'default',
|
||
},
|
||
})
|
||
|
||
const agentStore = useAgentStore()
|
||
const userStore = useUserStore()
|
||
const { isAgent, level } = storeToRefs(agentStore)
|
||
const { isLoggedIn } = storeToRefs(userStore)
|
||
|
||
function toRegister() {
|
||
uni.navigateTo({ url: '/pages/register/index' })
|
||
}
|
||
|
||
|
||
function toUpgrade() {
|
||
uni.navigateTo({ url: '/pages/agentUpgrade/index' })
|
||
}
|
||
|
||
function toAgreement() {
|
||
uni.navigateTo({ url: '/pages/agentManageAgreement/index' })
|
||
}
|
||
</script>
|
||
|
||
<template>
|
||
<view class="agent-system-guide page-wrap bg-[#f7f8fa]">
|
||
<scroll-view scroll-y class="guide-scroll" :show-scrollbar="false" enhanced>
|
||
<view class="guide-content pt-6 pb-4">
|
||
<view class="text-2xl font-bold mb-1 text-gray-800">代理系统指南</view>
|
||
<view class="text-sm text-gray-500">了解代理政策、等级特权与收益计算</view>
|
||
</view>
|
||
|
||
<view class="guide-content pb-6 flex flex-col gap-4">
|
||
<!-- 代理政策概述 -->
|
||
<view class="bg-white rounded-lg p-4 shadow-sm">
|
||
<view class="flex items-center mb-3">
|
||
<view class="w-1 h-5 rounded-full mr-2 bg-primary" />
|
||
<view class="text-lg font-semibold text-gray-800">代理政策概述</view>
|
||
</view>
|
||
<view class="flex flex-col gap-2.5 text-sm leading-relaxed text-gray-600">
|
||
<view>
|
||
全能查代理系统采用三级代理体系，为合作伙伴提供多层级、多收益的推广模式。
|
||
通过推广平台产品和服务，代理可获得推广佣金、下级返佣、升级返佣等多种收益。
|
||
</view>
|
||
<view>
|
||
系统分为<text class="font-semibold">普通代理</text>、<text class="font-semibold">黄金代理</text>、<text class="font-semibold">钻石代理</text>三个等级，
|
||
不同等级享有不同的权限和收益比例。
|
||
</view>
|
||
<view class="text-sm mt-2 text-gray-400">
|
||
详细政策请查看《代理管理协议》
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 代理等级说明 -->
|
||
<view class="bg-white rounded-lg p-4 shadow-sm">
|
||
<view class="flex items-center mb-4">
|
||
<view class="w-1 h-5 rounded-full mr-2 bg-primary" />
|
||
<view class="text-lg font-semibold text-gray-800">代理等级体系</view>
|
||
</view>
|
||
|
||
<view class="flex flex-col gap-4">
|
||
<!-- 普通代理 -->
|
||
<view class="border rounded-lg p-4 border-gray-200 bg-gray-50">
|
||
<view class="flex items-center justify-between mb-3">
|
||
<view class="flex items-center">
|
||
<view class="w-10 h-10 rounded-full bg-gray-400 flex items-center justify-center text-white font-semibold text-base mr-3">1</view>
|
||
<view>
|
||
<view class="text-base font-semibold text-gray-800">普通代理</view>
|
||
<view class="text-sm text-gray-500">基础代理特权</view>
|
||
</view>
|
||
</view>
|
||
<view class="px-2.5 py-1 rounded-full text-sm font-medium bg-gray-100 text-gray-600">入门级</view>
|
||
</view>
|
||
<view class="flex flex-col gap-1.5 text-sm text-gray-600">
|
||
<view class="flex items-start"><text class="text-green-500 mr-1.5 mt-0.5">✓</text><text>推广产品获得推广佣金</text></view>
|
||
<view class="flex items-start"><text class="text-green-500 mr-1.5 mt-0.5">✓</text><text>邀请下级代理，获得下级推广返佣</text></view>
|
||
<view class="flex items-start"><text class="text-green-500 mr-1.5 mt-0.5">✓</text><text>查看团队统计和转化率数据</text></view>
|
||
<view class="flex items-start"><text class="text-green-500 mr-1.5 mt-0.5">✓</text><text>生成和管理邀请码</text></view>
|
||
<view class="flex items-start"><text class="text-green-500 mr-1.5 mt-0.5">✓</text><text>申请升级为黄金或钻石代理</text></view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 黄金代理 -->
|
||
<view class="border rounded-lg p-4 border-amber-300 bg-amber-50">
|
||
<view class="flex items-center justify-between mb-3">
|
||
<view class="flex items-center">
|
||
<view class="w-10 h-10 rounded-full flex items-center justify-center text-white font-semibold text-base mr-3 bg-amber-500">2</view>
|
||
<view>
|
||
<view class="text-base font-semibold text-amber-800">黄金代理</view>
|
||
<view class="text-sm text-amber-700">高级代理特权</view>
|
||
</view>
|
||
</view>
|
||
<view class="px-2.5 py-1 rounded-full text-sm font-medium bg-amber-100 text-amber-800">进阶级</view>
|
||
</view>
|
||
<view class="flex flex-col gap-1.5 text-sm text-gray-600">
|
||
<view class="flex items-start"><text class="text-green-500 mr-1.5 mt-0.5">✓</text><text class="font-medium">享有普通代理所有权限</text></view>
|
||
<view class="flex items-start"><text class="text-amber-500 mr-1.5 mt-0.5">★</text><text>更高的推广佣金比例</text></view>
|
||
<view class="flex items-start"><text class="text-amber-500 mr-1.5 mt-0.5">★</text><text>更高的下级推广返佣比例</text></view>
|
||
<view class="flex items-start"><text class="text-amber-500 mr-1.5 mt-0.5">★</text><text>获得下级升级返佣（当普通下级升级为黄金时）</text></view>
|
||
<view class="flex items-start"><text class="text-amber-500 mr-1.5 mt-0.5">★</text><text>可申请升级为钻石代理</text></view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 钻石代理 -->
|
||
<view class="border rounded-lg p-4 border-purple-400 bg-purple-50">
|
||
<view class="flex items-center justify-between mb-3">
|
||
<view class="flex items-center">
|
||
<view class="w-10 h-10 rounded-full flex items-center justify-center text-white font-semibold text-base mr-3 bg-purple-600">💎</view>
|
||
<view>
|
||
<view class="text-base font-semibold text-purple-800">钻石代理</view>
|
||
<view class="text-sm text-purple-600">尊享代理特权</view>
|
||
</view>
|
||
</view>
|
||
<view class="px-2.5 py-1 rounded-full text-sm font-medium bg-purple-200 text-purple-800">最高级</view>
|
||
</view>
|
||
<view class="flex flex-col gap-1.5 text-sm text-gray-600">
|
||
<view class="flex items-start"><text class="text-green-500 mr-1.5 mt-0.5">✓</text><text class="font-medium">享有黄金代理所有权限</text></view>
|
||
<view class="flex items-start"><text class="text-purple-500 mr-1.5 mt-0.5">★</text><text>最高推广佣金比例</text></view>
|
||
<view class="flex items-start"><text class="text-purple-500 mr-1.5 mt-0.5">★</text><text>最高下级推广返佣比例</text></view>
|
||
<view class="flex items-start"><text class="text-purple-500 mr-1.5 mt-0.5">★</text><text>获得下级升级返佣（当普通/黄金下级升级时）</text></view>
|
||
<view class="flex items-start"><text class="text-purple-500 mr-1.5 mt-0.5">★</text><text class="font-medium">可调整下级代理等级（将普通代理升级为黄金代理）</text></view>
|
||
<view class="flex items-start"><text class="text-purple-500 mr-1.5 mt-0.5">★</text><text>专属客服支持</text></view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 收益计算说明 -->
|
||
<view class="bg-white rounded-lg p-4 shadow-sm">
|
||
<view class="flex items-center mb-4">
|
||
<view class="w-1 h-5 rounded-full mr-2 bg-primary" />
|
||
<view class="text-lg font-semibold text-gray-800">收益计算方式</view>
|
||
</view>
|
||
|
||
<view class="flex flex-col gap-3">
|
||
<!-- 推广佣金 -->
|
||
<view class="rounded-lg p-3 border-l-4 border-blue-500 bg-blue-50">
|
||
<view class="flex items-center mb-2">
|
||
<view class="w-5 h-5 rounded mr-2 bg-blue-500 flex items-center justify-center text-white text-xs">💰</view>
|
||
<view class="text-base font-semibold text-blue-800">推广佣金</view>
|
||
</view>
|
||
<view class="text-sm mb-2.5 text-gray-600">
|
||
当您推广的产品被用户购买并支付成功后，您将获得推广佣金。
|
||
</view>
|
||
<view class="bg-white rounded p-2.5 text-sm">
|
||
<view class="font-medium mb-1.5 text-gray-800">计算公式：</view>
|
||
<view class="mb-1.5 text-gray-600">推广佣金 = 订单金额 × 佣金比例</view>
|
||
<view class="text-sm text-gray-400">佣金比例根据您的代理等级和产品类型而定，等级越高，佣金比例越高</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 下级推广返佣 -->
|
||
<view class="rounded-lg p-3 border-l-4 border-green-500 bg-green-50">
|
||
<view class="flex items-center mb-2">
|
||
<view class="w-5 h-5 rounded mr-2 bg-green-500 flex items-center justify-center text-white text-xs">🎁</view>
|
||
<view class="text-base font-semibold text-green-800">下级推广返佣</view>
|
||
</view>
|
||
<view class="text-sm mb-2.5 text-gray-600">
|
||
当您的下级代理推广产品产生订单时，您将获得一定比例的返佣。
|
||
</view>
|
||
<view class="bg-white rounded p-2.5 text-sm">
|
||
<view class="font-medium mb-1.5 text-gray-800">返佣规则：</view>
|
||
<view class="mb-1.5 text-gray-600">• 直接下级：获得直接下级推广订单的返佣</view>
|
||
<view class="mb-1.5 text-gray-600">• 间接下级：获得间接下级推广订单的返佣</view>
|
||
<view class="mb-1.5 text-gray-600">• 返佣比例根据您的代理等级而定</view>
|
||
<view class="text-sm text-gray-400">返佣金额 = 下级订单金额 × 返佣比例</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 下级升级返佣 -->
|
||
<view class="rounded-lg p-3 border-l-4 border-purple-500 bg-purple-50">
|
||
<view class="flex items-center mb-2">
|
||
<view class="w-5 h-5 rounded mr-2 bg-purple-500 flex items-center justify-center text-white text-xs">↑</view>
|
||
<view class="text-base font-semibold text-purple-800">下级升级返佣</view>
|
||
</view>
|
||
<view class="text-sm mb-2.5 text-gray-600">
|
||
当您的下级代理付费升级为更高等级时，您将获得升级返佣。
|
||
</view>
|
||
<view class="bg-white rounded p-2.5 text-sm">
|
||
<view class="font-medium mb-1.5 text-gray-800">返佣规则：</view>
|
||
<view class="mb-1.5 text-gray-600">• 普通代理升级为黄金代理：上级获得返佣</view>
|
||
<view class="mb-1.5 text-gray-600">• 普通/黄金代理升级为钻石代理：上级获得返佣</view>
|
||
<view class="mb-1.5 text-gray-600">• 返佣金额由系统配置，在升级时显示</view>
|
||
<view class="text-sm text-gray-400">只有黄金代理和钻石代理才能获得下级升级返佣</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 收益统计 -->
|
||
<view class="rounded-lg p-3 border-l-4 border-orange-500 bg-orange-50">
|
||
<view class="flex items-center mb-2">
|
||
<view class="w-5 h-5 rounded mr-2 bg-orange-500 flex items-center justify-center text-white text-xs">📋</view>
|
||
<view class="text-base font-semibold text-orange-800">收益统计</view>
|
||
</view>
|
||
<view class="bg-white rounded p-2.5 text-sm text-gray-600">
|
||
<view class="mb-1.5">您可以在"我的"页面查看详细的收益统计：</view>
|
||
<view>• <text class="font-medium">累计总收益</text>：所有收益的总和</view>
|
||
<view>• <text class="font-medium">今日收益</text>：当天的收益金额</view>
|
||
<view>• <text class="font-medium">本月收益</text>：本月的收益金额</view>
|
||
<view>• <text class="font-medium">余额</text>：可提现的金额</view>
|
||
<view>• <text class="font-medium">风险保障金</text>：冻结的保障金</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 功能玩法 -->
|
||
<view class="bg-white rounded-lg p-4 shadow-sm">
|
||
<view class="flex items-center mb-4">
|
||
<view class="w-1 h-5 rounded-full mr-2 bg-primary" />
|
||
<view class="text-lg font-semibold text-gray-800">功能玩法</view>
|
||
</view>
|
||
|
||
<view class="flex flex-row flex-wrap gap-3">
|
||
<view class="rounded-lg p-3 border border-blue-200 bg-blue-50 flex-1 min-w-[45%]">
|
||
<view class="flex items-center mb-1.5">
|
||
<view class="text-blue-500 mr-1.5 text-sm">分享</view>
|
||
<view class="font-semibold text-sm text-blue-800">推广查询</view>
|
||
</view>
|
||
<view class="text-sm leading-relaxed text-gray-600">生成推广链接，分享给用户购买查询服务，获得推广佣金</view>
|
||
</view>
|
||
<view class="rounded-lg p-3 border border-green-200 bg-green-50 flex-1 min-w-[45%]">
|
||
<view class="flex items-center mb-1.5">
|
||
<view class="text-green-500 mr-1.5 text-sm">邀请</view>
|
||
<view class="font-semibold text-sm text-green-800">邀请下级</view>
|
||
</view>
|
||
<view class="text-sm leading-relaxed text-gray-600">通过邀请码邀请他人成为您的下级代理，获得下级推广返佣</view>
|
||
</view>
|
||
<view class="rounded-lg p-3 border border-purple-200 bg-purple-50 flex-1 min-w-[45%]">
|
||
<view class="flex items-center mb-1.5">
|
||
<view class="text-purple-500 mr-1.5 text-sm">团队</view>
|
||
<view class="font-semibold text-sm text-purple-800">团队管理</view>
|
||
</view>
|
||
<view class="text-sm leading-relaxed text-gray-600">查看团队统计、转化率数据，了解团队发展情况</view>
|
||
</view>
|
||
<view class="rounded-lg p-3 border border-amber-200 bg-amber-50 flex-1 min-w-[45%]">
|
||
<view class="flex items-center mb-1.5">
|
||
<view class="text-amber-500 mr-1.5 text-sm">升级</view>
|
||
<view class="font-semibold text-sm text-amber-800">升级代理</view>
|
||
</view>
|
||
<view class="text-sm leading-relaxed text-gray-600">付费升级为更高等级，享受更高佣金和返佣比例</view>
|
||
</view>
|
||
<view class="rounded-lg p-3 border border-indigo-200 bg-indigo-50 flex-1 min-w-[45%]">
|
||
<view class="flex items-center mb-1.5">
|
||
<view class="text-indigo-500 mr-1.5 text-sm">码</view>
|
||
<view class="font-semibold text-sm text-indigo-800">邀请码管理</view>
|
||
</view>
|
||
<view class="text-sm leading-relaxed text-gray-600">生成、查看和管理邀请码，用于邀请下级代理</view>
|
||
</view>
|
||
<view class="rounded-lg p-3 border border-red-200 bg-red-50 flex-1 min-w-[45%]">
|
||
<view class="flex items-center mb-1.5">
|
||
<view class="text-red-500 mr-1.5 text-sm">认证</view>
|
||
<view class="font-semibold text-sm text-red-800">实名认证</view>
|
||
</view>
|
||
<view class="text-sm leading-relaxed text-gray-600">完成实名认证后，才能申请提现收益</view>
|
||
</view>
|
||
<view class="rounded-lg p-3 border border-teal-200 bg-teal-50 flex-1 min-w-[45%]">
|
||
<view class="flex items-center mb-1.5">
|
||
<view class="text-teal-500 mr-1.5 text-sm">提现</view>
|
||
<view class="font-semibold text-sm text-teal-800">提现功能</view>
|
||
</view>
|
||
<view class="text-sm leading-relaxed text-gray-600">将收益提现到银行卡，需要完成实名认证</view>
|
||
</view>
|
||
<view class="rounded-lg p-3 border border-violet-200 bg-violet-50 flex-1 min-w-[45%]">
|
||
<view class="flex items-center mb-1.5">
|
||
<view class="text-violet-500 mr-1.5 text-sm">设置</view>
|
||
<view class="font-semibold text-sm text-violet-800">调整级别</view>
|
||
</view>
|
||
<view class="text-sm leading-relaxed text-gray-600"><text class="font-medium text-purple-600">钻石代理专属</text>：可将普通下级升级为黄金代理</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 操作指南 -->
|
||
<view class="bg-white rounded-lg p-4 shadow-sm">
|
||
<view class="flex items-center mb-4">
|
||
<view class="w-1 h-5 rounded-full mr-2 bg-primary" />
|
||
<view class="text-lg font-semibold text-gray-800">操作指南</view>
|
||
</view>
|
||
|
||
<view class="mb-4">
|
||
<view class="flex items-center mb-2.5">
|
||
<view class="w-5 h-5 rounded mr-2 bg-blue-500 flex items-center justify-center text-white text-xs">1</view>
|
||
<view class="text-base font-semibold text-gray-800">如何推广报告</view>
|
||
</view>
|
||
<view class="flex flex-col gap-2 text-sm leading-relaxed text-gray-600">
|
||
<view class="flex items-start"><text class="text-blue-500 mr-1.5 mt-0.5 font-medium">1.</text><text>登录代理账户后，进入"推广"页面，选择要推广的报告类型（如个人大数据、婚恋风险、入职背调等）。</text></view>
|
||
<view class="flex items-start"><text class="text-blue-500 mr-1.5 mt-0.5 font-medium">2.</text><text>系统将自动生成专属推广链接，您可以将该链接分享给潜在用户。用户通过您的推广链接购买查询服务后，您即可获得推广佣金。</text></view>
|
||
<view class="flex items-start"><text class="text-blue-500 mr-1.5 mt-0.5 font-medium">3.</text><text>您可以在推广页面设置查询服务的售价（需在平台设定的价格范围内），售价与成本价的差额即为您的推广收益。</text></view>
|
||
<view class="flex items-start"><text class="text-blue-500 mr-1.5 mt-0.5 font-medium">4.</text><text>推广链接支持多种分享方式，包括复制链接、生成二维码、生成短链等，方便您在不同渠道进行推广。</text></view>
|
||
<view class="flex items-start"><text class="text-blue-500 mr-1.5 mt-0.5 font-medium">5.</text><text>您可以在"推广查询记录"中查看所有通过您推广链接产生的订单详情，包括订单金额、收益金额、订单状态等信息。</text></view>
|
||
<view class="flex items-start"><text class="text-blue-500 mr-1.5 mt-0.5 font-medium">6.</text><text>推广佣金将在用户完成支付后自动结算到您的账户余额中，您可以在"我的"页面查看收益统计。</text></view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="border-t border-gray-200 pt-4">
|
||
<view class="flex items-center mb-2.5">
|
||
<view class="w-5 h-5 rounded mr-2 bg-green-500 flex items-center justify-center text-white text-xs">2</view>
|
||
<view class="text-base font-semibold text-gray-800">如何邀请下级代理</view>
|
||
</view>
|
||
<view class="flex flex-col gap-2 text-sm leading-relaxed text-gray-600">
|
||
<view class="flex items-start"><text class="text-green-500 mr-1.5 mt-0.5 font-medium">1.</text><text>登录代理账户后，进入"邀请码管理"页面，系统会为您生成专属邀请码。</text></view>
|
||
<view class="flex items-start"><text class="text-green-500 mr-1.5 mt-0.5 font-medium">2.</text><text>您可以将邀请码分享给想要成为代理的用户。用户通过您的邀请码注册成为代理后，将自动成为您的下级代理。</text></view>
|
||
<view class="flex items-start"><text class="text-green-500 mr-1.5 mt-0.5 font-medium">3.</text><text>当您的下级代理推广产品产生订单时，您将获得一定比例的下级推广返佣。返佣比例根据您的代理等级而定，等级越高，返佣比例越高。</text></view>
|
||
<view class="flex items-start"><text class="text-green-500 mr-1.5 mt-0.5 font-medium">4.</text><text>您可以在"我的团队"页面查看所有下级代理的信息，包括直接下级和间接下级，以及团队统计数据。</text></view>
|
||
<view class="flex items-start"><text class="text-green-500 mr-1.5 mt-0.5 font-medium">5.</text><text>当您的下级代理付费升级为更高等级时（如普通代理升级为黄金代理），您将获得下级升级返佣。只有黄金代理和钻石代理才能获得下级升级返佣。</text></view>
|
||
<view class="flex items-start"><text class="text-green-500 mr-1.5 mt-0.5 font-medium">6.</text><text>钻石代理拥有特殊权限，可以将普通下级代理直接升级为黄金代理，无需下级代理付费。</text></view>
|
||
<view class="flex items-start"><text class="text-green-500 mr-1.5 mt-0.5 font-medium">7.</text><text>您可以在"下级推广收益"中查看所有来自下级代理的返佣明细，包括推广返佣和升级返佣。</text></view>
|
||
<view class="flex items-start"><text class="text-green-500 mr-1.5 mt-0.5 font-medium">8.</text><text>邀请下级代理是扩大团队规模、增加收益的重要方式，建议您积极发展下级代理，建立稳定的推广团队。</text></view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 提现说明 -->
|
||
<view class="bg-white rounded-lg p-4 shadow-sm">
|
||
<view class="flex items-center mb-3">
|
||
<view class="w-1 h-5 rounded-full mr-2 bg-primary" />
|
||
<view class="text-lg font-semibold text-gray-800">提现说明</view>
|
||
</view>
|
||
<view class="flex flex-col gap-2.5 text-sm leading-relaxed">
|
||
<view class="rounded p-2.5 border-l-4 border-amber-400 bg-amber-50">
|
||
<view class="font-medium mb-1 text-amber-800">提现条件：</view>
|
||
<view class="text-amber-900">1. 必须完成实名认证（三要素核验）</view>
|
||
<view class="text-amber-900">2. 单笔提现金额需达到 50 元及以上</view>
|
||
<view class="text-amber-900">3. 风险保障金需满足平台要求</view>
|
||
</view>
|
||
<view class="rounded p-2.5 border-l-4 border-blue-400 bg-blue-50">
|
||
<view class="font-medium mb-1 text-blue-800">注意事项：</view>
|
||
<view class="text-blue-900">• 提现到账账户的实名信息必须与实名认证信息完全一致（同一身份证/同一持卡人），否则可能提现失败或原路退回</view>
|
||
<view class="text-blue-900">• 实名认证时请务必确认使用的证件信息与后续用于收款的账户为同一人</view>
|
||
<view class="text-blue-900">• 平台会根据国家税收法律法规代扣代缴个人所得税</view>
|
||
<view class="text-blue-900">• 提现申请提交后，平台会在规定时间内处理</view>
|
||
<view class="text-blue-900">• 可在"提现记录"中查看提现状态</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 操作按钮 -->
|
||
<view class="flex flex-row flex-wrap gap-2.5 pb-8 safe-area-bottom">
|
||
<button v-if="!isAgent && isLoggedIn" class="flex-1 py-2.5 rounded-lg text-white text-sm font-medium bg-primary" @click="toRegister">立即注册成为代理</button>
|
||
<view v-if="!isLoggedIn" class="flex-1 py-2.5 rounded-lg text-gray-500 text-sm font-medium bg-gray-200 text-center flex items-center justify-center">正在登录中，请稍候...</view>
|
||
<button v-if="isAgent && level < 3" class="flex-1 py-2.5 rounded-lg text-white text-sm font-medium bg-purple-500" @click="toUpgrade">升级代理等级</button>
|
||
<button class="px-4 py-2.5 rounded-lg border border-primary text-sm font-medium text-primary" @click="toAgreement">查看协议</button>
|
||
</view>
|
||
</view>
|
||
</scroll-view>
|
||
</view>
|
||
</template>
|
||
|
||
<style lang="scss" scoped>
|
||
.page-wrap {
|
||
width: 100%;
|
||
height: 100vh;
|
||
box-sizing: border-box;
|
||
}
|
||
.guide-scroll {
|
||
width: 100%;
|
||
height: 100%;
|
||
box-sizing: border-box;
|
||
}
|
||
/* 左右留白，避免文字贴边（小程序 rpx 自适应） */
|
||
.guide-content {
|
||
padding-left: 48rpx;
|
||
padding-right: 48rpx;
|
||
box-sizing: border-box;
|
||
}
|
||
.safe-area-bottom {
|
||
padding-bottom: constant(safe-area-inset-bottom);
|
||
padding-bottom: env(safe-area-inset-bottom);
|
||
}
|
||
/* 小程序 button 默认样式覆盖 */
|
||
.agent-system-guide button {
|
||
margin: 0;
|
||
line-height: 1.4;
|
||
}
|
||
.agent-system-guide button::after {
|
||
border: none;
|
||
}
|
||
</style>
|