<template>
|
<view class="page">
|
<!-- 自定义导航栏：状态栏留白由行内 paddingTop 撑开 -->
|
<view class="nav" :style="{ paddingTop: statusBarHeight + 'px' }">
|
<view class="nav-bar">
|
<view class="nav-back" @tap="handleBack">
|
<view class="icon-back"></view>
|
</view>
|
<text class="nav-title">我的邀请</text>
|
</view>
|
</view>
|
|
<!-- 三段式 Tab：邀请码 / 我邀请的 / 邀请我的 -->
|
<view class="tabs">
|
<view
|
v-for="tab in TAB_LIST"
|
:key="tab.key"
|
class="tab-item"
|
@tap="handleTabChange(tab.key)"
|
>
|
<text class="tab-text" :class="{ 'tab-text--active': activeTab === tab.key }">
|
{{ tab.label }}
|
</text>
|
<!-- 选中态底部指示条 -->
|
<view v-if="activeTab === tab.key" class="tab-indicator"></view>
|
</view>
|
</view>
|
|
<view class="body">
|
<!-- ==================== Tab1：邀请码 ==================== -->
|
<view v-if="activeTab === 'code'" class="code-panel">
|
<view class="qrcode-card">
|
<!-- 真实小程序码（base64 DataURI），扫码直达注册页并自动填入邀请码 -->
|
<image v-if="qrcode" class="qrcode-img" :src="qrcode" mode="aspectFit" />
|
<view v-else class="qrcode-placeholder">
|
<text class="qrcode-placeholder-text">二维码生成中…</text>
|
</view>
|
<text class="qrcode-caption">我的邀请码</text>
|
<!-- 点击复制邀请码 -->
|
<view class="code-value" @tap="handleCopyCode">
|
<text class="code-value-text">{{ inviteCode || '—' }}</text>
|
</view>
|
</view>
|
|
<!-- 分享按钮：open-type=share 触发 onShareAppMessage -->
|
<button class="btn-share" open-type="share">
|
<text class="btn-share-text">分享邀请码</text>
|
</button>
|
</view>
|
|
<!-- ==================== Tab2：我邀请的 ==================== -->
|
<view v-else-if="activeTab === 'invitees'" class="invitee-panel">
|
<view v-if="invitees.length > 0" class="invitee-list">
|
<view v-for="item in invitees" :key="item.userId" class="invitee-row">
|
<!-- 头像：为空回退默认用户图标 -->
|
<view class="invitee-avatar">
|
<image
|
v-if="item.avatar"
|
class="invitee-avatar-img"
|
:src="item.avatar"
|
mode="aspectFill"
|
/>
|
<view v-else class="icon icon-user"></view>
|
</view>
|
<!-- 中部：昵称 + 等级徽标 / 脱敏手机号 -->
|
<view class="invitee-main">
|
<view class="invitee-name-line">
|
<text class="invitee-name">{{ displayName(item) }}</text>
|
<view class="level-badge">
|
<text class="level-badge-text">{{ item.systemLevel || 'C' }}</text>
|
</view>
|
</view>
|
<text class="invitee-phone">{{ item.phone || '—' }}</text>
|
</view>
|
<!-- 右侧：合计消费 / 绑定日 -->
|
<view class="invitee-side">
|
<text class="invitee-amount">合计消费：¥{{ formatYuanAmount(item.buyAmountTotal) }}</text>
|
<text v-if="item.bindDate" class="invitee-date">绑定日：{{ item.bindDate }}</text>
|
</view>
|
</view>
|
</view>
|
|
<!-- 空态：无邀请记录 -->
|
<view v-else-if="!listLoading" class="empty">
|
<view class="empty-icon-wrap">
|
<view class="icon icon-empty-invite"></view>
|
</view>
|
<text class="empty-title">还没有邀请好友</text>
|
<text class="empty-desc">分享邀请码，邀请好友加入</text>
|
</view>
|
|
<!-- 加载更多提示 -->
|
<view v-if="invitees.length > 0" class="list-foot">
|
<text class="list-foot-text">{{ hasMore ? '加载中…' : '没有更多了' }}</text>
|
</view>
|
</view>
|
|
<!-- ==================== Tab3：邀请我的 ==================== -->
|
<view v-else class="referrer-panel">
|
<view v-if="referrer && referrer.userId" class="referrer-card">
|
<view class="referrer-avatar">
|
<image
|
v-if="referrer.avatar"
|
class="referrer-avatar-img"
|
:src="referrer.avatar"
|
mode="aspectFill"
|
/>
|
<view v-else class="icon icon-user-lg"></view>
|
</view>
|
<view class="referrer-name-line">
|
<text class="referrer-name">{{ displayName(referrer) }}</text>
|
<view class="level-badge">
|
<text class="level-badge-text">{{ referrer.systemLevel || 'C' }}</text>
|
</view>
|
</view>
|
<text class="referrer-phone">{{ referrer.phone || '—' }}</text>
|
<text v-if="referrer.bindDate" class="referrer-date">绑定日：{{ referrer.bindDate }}</text>
|
</view>
|
|
<!-- 空态：无上级信息 -->
|
<view v-else-if="!referrerLoading" class="empty">
|
<view class="empty-icon-wrap">
|
<view class="icon icon-empty-referrer"></view>
|
</view>
|
<text class="empty-title">暂无上级信息</text>
|
<text class="empty-desc">绑定上级后这里会展示ta的信息</text>
|
</view>
|
</view>
|
</view>
|
</view>
|
</template>
|
|
<script setup>
|
import { ref } from 'vue'
|
import { onLoad, onReachBottom, onShareAppMessage } from '@dcloudio/uni-app'
|
import { ensureLogin } from '@/utils/request.js'
|
import { getInviteCode, getInviteQrcode, getInvitees, getReferrer } from '@/api/index.js'
|
|
/** 状态栏高度：自定义导航栏下用于顶部留白 */
|
const statusBarHeight = uni.getSystemInfoSync().statusBarHeight || 0
|
|
/** 每页条数：与后端 TableSupport 默认值保持一致 */
|
const PAGE_SIZE = 10
|
|
/** 三 Tab 配置：key 与后端无关，仅前端切换用 */
|
const TAB_LIST = [
|
{ key: 'code', label: '邀请码' },
|
{ key: 'invitees', label: '我邀请的' },
|
{ key: 'referrer', label: '邀请我的' }
|
]
|
|
/** 当前 Tab，默认「邀请码」 */
|
const activeTab = ref('code')
|
|
/** 本人邀请码原值（8 位 A-Z0-9） */
|
const inviteCode = ref('')
|
|
/** 本人邀请码小程序码（PNG base64 DataURI），直接作为 image src */
|
const qrcode = ref('')
|
|
/** 我邀请的 列表数据 */
|
const invitees = ref([])
|
/** 我邀请的 当前页码（下一页待请求页码） */
|
const pageNum = ref(1)
|
/** 我邀请的 是否还有下一页 */
|
const hasMore = ref(true)
|
/** 我邀请的 加载中标志（防止重复请求） */
|
const listLoading = ref(false)
|
|
/** 邀请我的 上级信息，无上级时为 null */
|
const referrer = ref(null)
|
/** 邀请我的 加载中标志 */
|
const referrerLoading = ref(false)
|
/** 邀请我的 是否已加载过（懒加载，避免重复请求） */
|
const referrerLoaded = ref(false)
|
|
/**
|
* 展示名：昵称优先，为空时回退脱敏手机号，均无则兜底「会员」
|
* @param {Object} user 含 nickname / phone 的用户对象
|
*/
|
const displayName = (user) => (user && (user.nickname || user.phone)) || '会员'
|
|
/**
|
* 合计消费格式化：后端 buyAmountTotal 单位为「元」，保留两位小数
|
* 注意：不可复用 formatYuan（后者按「分」处理）
|
* @param {Number|String} val 金额（元）
|
*/
|
const formatYuanAmount = (val) => {
|
const num = Number(val)
|
return Number.isFinite(num) ? num.toFixed(2) : '0.00'
|
}
|
|
/** 拉取本人邀请码，成功后继续拉取小程序码 */
|
const loadInviteInfo = async () => {
|
try {
|
const res = await getInviteCode()
|
inviteCode.value = (res.data && res.data.referralCode) || ''
|
if (inviteCode.value) {
|
loadQrcode(inviteCode.value)
|
}
|
} catch (e) {
|
console.error('[INVITE] 获取邀请码失败', e)
|
}
|
}
|
|
/**
|
* 拉取小程序码（以邀请码为 scene）
|
* @param {String} code 邀请码
|
*/
|
const loadQrcode = async (code) => {
|
try {
|
const res = await getInviteQrcode(code)
|
qrcode.value = (res.data && res.data.qrcode) || ''
|
} catch (e) {
|
console.error('[INVITE] 获取邀请二维码失败', e)
|
uni.showToast({ title: '二维码生成失败，请重试', icon: 'none' })
|
}
|
}
|
|
/**
|
* 拉取我邀请的列表（分页）
|
* @param {Boolean} reset 是否重置为第一页（首次进入 / 下拉刷新）
|
*/
|
const loadInvitees = async (reset = false) => {
|
if (listLoading.value) return
|
// 非重置且已无更多数据时直接返回，避免无效请求
|
if (!reset && !hasMore.value) return
|
if (reset) {
|
pageNum.value = 1
|
hasMore.value = true
|
}
|
listLoading.value = true
|
try {
|
const res = await getInvitees({ pageNum: pageNum.value, pageSize: PAGE_SIZE })
|
// 分页接口返回 TableDataInfo：数据在顶层 rows（非 data 包裹）
|
const rows = res.rows || []
|
invitees.value = reset ? rows : invitees.value.concat(rows)
|
const total = res.total || 0
|
// 已加载条数达到总数或本页返回空，视为无更多
|
hasMore.value = rows.length > 0 && invitees.value.length < total
|
if (hasMore.value) pageNum.value += 1
|
} catch (e) {
|
console.error('[INVITE] 获取邀请列表失败', e)
|
} finally {
|
listLoading.value = false
|
}
|
}
|
|
/** 拉取邀请我的（上级）信息 */
|
const loadReferrer = async () => {
|
referrerLoading.value = true
|
try {
|
const res = await getReferrer()
|
referrer.value = res.data || null
|
} catch (e) {
|
console.error('[INVITE] 获取上级信息失败', e)
|
referrer.value = null
|
} finally {
|
referrerLoading.value = false
|
referrerLoaded.value = true
|
}
|
}
|
|
/** Tab 切换：进入「我邀请的」「邀请我的」时按需懒加载 */
|
const handleTabChange = (key) => {
|
if (activeTab.value === key) return
|
activeTab.value = key
|
if (key === 'invitees' && invitees.value.length === 0) {
|
loadInvitees(true)
|
}
|
if (key === 'referrer' && !referrerLoaded.value) {
|
loadReferrer()
|
}
|
}
|
|
/** 点击邀请码：复制到剪贴板 */
|
const handleCopyCode = () => {
|
if (!inviteCode.value) return
|
uni.setClipboardData({
|
data: inviteCode.value,
|
success: () => uni.showToast({ title: '邀请码已复制', icon: 'none' })
|
})
|
}
|
|
/** 返回：优先返回上一页，无上一页时回个人中心（Tab 页） */
|
const handleBack = () => {
|
const pages = getCurrentPages()
|
if (pages.length > 1) {
|
uni.navigateBack()
|
return
|
}
|
uni.switchTab({ url: '/pages/profile/index' })
|
}
|
|
/** 页面加载：校验登录态并拉取邀请码与小程序码 */
|
onLoad(() => {
|
if (!ensureLogin()) return
|
loadInviteInfo()
|
})
|
|
/** 触底加载更多（仅「我邀请的」Tab 生效） */
|
onReachBottom(() => {
|
if (activeTab.value === 'invitees') {
|
loadInvitees(false)
|
}
|
})
|
|
/** 分享：携带邀请码直达注册页，扫码/点开注册即自动绑定 */
|
onShareAppMessage(() => {
|
const path = inviteCode.value
|
? `/pages/login/register?referralCode=${inviteCode.value}`
|
: '/pages/login/register'
|
return {
|
title: '邀请你加入代谢300，注册自动绑定邀请码',
|
path
|
}
|
})
|
</script>
|
|
<style scoped lang="scss">
|
.page {
|
min-height: 100vh;
|
display: flex;
|
flex-direction: column;
|
box-sizing: border-box;
|
background-color: #f8fafc;
|
}
|
|
/* ==================== 自定义导航栏 ==================== */
|
|
.nav {
|
flex-shrink: 0;
|
background-color: #ffffff;
|
}
|
|
.nav-bar {
|
position: relative;
|
height: 88rpx;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
}
|
|
.nav-back {
|
position: absolute;
|
left: 16rpx;
|
top: 50%;
|
transform: translateY(-50%);
|
width: 64rpx;
|
height: 64rpx;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
}
|
|
/* 纯 CSS 左向箭头：左 + 下边框旋转 45° */
|
.icon-back {
|
width: 22rpx;
|
height: 22rpx;
|
border-left: 4rpx solid #0f172a;
|
border-bottom: 4rpx solid #0f172a;
|
transform: rotate(45deg);
|
}
|
|
.nav-title {
|
font-size: 34rpx;
|
font-weight: 700;
|
line-height: 1;
|
letter-spacing: 1rpx;
|
color: #0f172a;
|
}
|
|
/* ==================== 三段式 Tab ==================== */
|
|
.tabs {
|
flex-shrink: 0;
|
display: flex;
|
align-items: center;
|
background-color: #ffffff;
|
border-bottom: 2rpx solid #e2e8f0;
|
}
|
|
.tab-item {
|
flex: 1;
|
height: 88rpx;
|
position: relative;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
}
|
|
.tab-text {
|
font-size: 30rpx;
|
line-height: 1;
|
color: #64748b;
|
}
|
|
.tab-text--active {
|
font-weight: 600;
|
color: #10b981;
|
}
|
|
/* 选中态底部指示条 */
|
.tab-indicator {
|
position: absolute;
|
bottom: 0;
|
left: 50%;
|
transform: translateX(-50%);
|
width: 96rpx;
|
height: 4rpx;
|
border-radius: 4rpx;
|
background-color: #10b981;
|
}
|
|
.body {
|
flex: 1;
|
display: flex;
|
flex-direction: column;
|
}
|
|
/* ==================== Tab1：邀请码 ==================== */
|
|
.code-panel {
|
flex: 1;
|
display: flex;
|
flex-direction: column;
|
padding: 40rpx 40rpx 60rpx;
|
}
|
|
.qrcode-card {
|
display: flex;
|
flex-direction: column;
|
align-items: center;
|
padding: 60rpx 32rpx 56rpx;
|
border-radius: 16rpx;
|
background-color: #ffffff;
|
border: 2rpx solid #e2e8f0;
|
box-shadow: 0 6rpx 16rpx rgba(15, 23, 42, 0.06);
|
}
|
|
.qrcode-img {
|
width: 400rpx;
|
height: 400rpx;
|
}
|
|
.qrcode-placeholder {
|
width: 400rpx;
|
height: 400rpx;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
border-radius: 12rpx;
|
background-color: #f1f5f9;
|
}
|
|
.qrcode-placeholder-text {
|
font-size: 26rpx;
|
line-height: 1;
|
color: #94a3b8;
|
}
|
|
.qrcode-caption {
|
margin-top: 40rpx;
|
font-size: 30rpx;
|
font-weight: 600;
|
line-height: 1;
|
color: #0f172a;
|
}
|
|
.code-value {
|
margin-top: 20rpx;
|
padding: 12rpx 32rpx;
|
border-radius: 12rpx;
|
background-color: #ecfdf5;
|
}
|
|
.code-value-text {
|
font-size: 32rpx;
|
font-weight: 700;
|
letter-spacing: 6rpx;
|
line-height: 1;
|
color: #10b981;
|
}
|
|
/* 分享按钮：整宽绿色胶囊 */
|
.btn-share {
|
margin-top: auto;
|
width: 100%;
|
height: 96rpx;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
padding: 0;
|
border: none;
|
border-radius: 48rpx;
|
background: linear-gradient(90deg, #34d399 0%, #10b981 100%);
|
box-shadow: 0 12rpx 32rpx rgba(16, 185, 129, 0.28);
|
}
|
|
/* 覆盖小程序 button 默认伪元素边框 */
|
.btn-share::after {
|
border: none;
|
}
|
|
.btn-share-text {
|
font-size: 32rpx;
|
font-weight: 600;
|
line-height: 1;
|
color: #ffffff;
|
}
|
|
/* ==================== Tab2：我邀请的 ==================== */
|
|
.invitee-panel {
|
flex: 1;
|
display: flex;
|
flex-direction: column;
|
padding: 24rpx 32rpx 0;
|
}
|
|
.invitee-list {
|
border-radius: 16rpx;
|
overflow: hidden;
|
background-color: #ffffff;
|
border: 2rpx solid #e2e8f0;
|
box-shadow: 0 6rpx 16rpx rgba(15, 23, 42, 0.06);
|
}
|
|
.invitee-row {
|
display: flex;
|
align-items: center;
|
padding: 28rpx 28rpx;
|
border-bottom: 2rpx solid #f1f5f9;
|
}
|
|
/* 末行无分隔线 */
|
.invitee-row:last-child {
|
border-bottom: none;
|
}
|
|
.invitee-avatar {
|
flex-shrink: 0;
|
width: 88rpx;
|
height: 88rpx;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
border-radius: 50%;
|
overflow: hidden;
|
background-color: #f1f5f9;
|
}
|
|
.invitee-avatar-img {
|
width: 100%;
|
height: 100%;
|
}
|
|
.invitee-main {
|
flex: 1;
|
min-width: 0;
|
margin-left: 24rpx;
|
display: flex;
|
flex-direction: column;
|
gap: 12rpx;
|
}
|
|
.invitee-name-line {
|
display: flex;
|
align-items: center;
|
gap: 12rpx;
|
}
|
|
.invitee-name {
|
max-width: 240rpx;
|
font-size: 30rpx;
|
font-weight: 600;
|
line-height: 1;
|
color: #0f172a;
|
overflow: hidden;
|
white-space: nowrap;
|
text-overflow: ellipsis;
|
}
|
|
.invitee-phone {
|
font-size: 26rpx;
|
line-height: 1;
|
color: #64748b;
|
}
|
|
.invitee-side {
|
flex-shrink: 0;
|
margin-left: 16rpx;
|
display: flex;
|
flex-direction: column;
|
align-items: flex-end;
|
gap: 12rpx;
|
}
|
|
.invitee-amount {
|
font-size: 28rpx;
|
font-weight: 600;
|
line-height: 1;
|
color: #0f172a;
|
}
|
|
.invitee-date {
|
font-size: 24rpx;
|
line-height: 1;
|
color: #94a3b8;
|
}
|
|
/* ==================== Tab3：邀请我的 ==================== */
|
|
.referrer-panel {
|
flex: 1;
|
display: flex;
|
flex-direction: column;
|
align-items: center;
|
padding: 80rpx 40rpx 0;
|
}
|
|
.referrer-card {
|
width: 100%;
|
display: flex;
|
flex-direction: column;
|
align-items: center;
|
padding: 64rpx 32rpx;
|
border-radius: 16rpx;
|
background-color: #ffffff;
|
border: 2rpx solid #e2e8f0;
|
box-shadow: 0 6rpx 16rpx rgba(15, 23, 42, 0.06);
|
}
|
|
.referrer-avatar {
|
width: 160rpx;
|
height: 160rpx;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
border-radius: 50%;
|
overflow: hidden;
|
background-color: #f1f5f9;
|
}
|
|
.referrer-avatar-img {
|
width: 100%;
|
height: 100%;
|
}
|
|
.referrer-name-line {
|
margin-top: 32rpx;
|
display: flex;
|
align-items: center;
|
gap: 16rpx;
|
}
|
|
.referrer-name {
|
font-size: 36rpx;
|
font-weight: 700;
|
line-height: 1;
|
color: #0f172a;
|
}
|
|
.referrer-phone {
|
margin-top: 24rpx;
|
font-size: 30rpx;
|
line-height: 1;
|
letter-spacing: 1rpx;
|
color: #334155;
|
}
|
|
.referrer-date {
|
margin-top: 20rpx;
|
font-size: 26rpx;
|
line-height: 1;
|
color: #94a3b8;
|
}
|
|
/* ==================== 等级徽标（实心绿胶囊） ==================== */
|
|
.level-badge {
|
display: flex;
|
align-items: center;
|
padding: 4rpx 14rpx;
|
border-radius: 6rpx;
|
background-color: #10b981;
|
}
|
|
.level-badge-text {
|
font-size: 22rpx;
|
font-weight: 600;
|
line-height: 1;
|
color: #ffffff;
|
}
|
|
/* ==================== 空态 / 加载更多 ==================== */
|
|
.empty {
|
flex: 1;
|
display: flex;
|
flex-direction: column;
|
align-items: center;
|
padding: 140rpx 0 0;
|
}
|
|
/* 圆形底衬 + 空态图标 */
|
.empty-icon-wrap {
|
width: 200rpx;
|
height: 200rpx;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
border-radius: 50%;
|
background-color: #f1f5f9;
|
}
|
|
.empty-title {
|
margin-top: 36rpx;
|
font-size: 30rpx;
|
font-weight: 600;
|
line-height: 1;
|
color: #475569;
|
}
|
|
.empty-desc {
|
margin-top: 16rpx;
|
font-size: 26rpx;
|
line-height: 1;
|
color: #94a3b8;
|
}
|
|
.list-foot {
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
padding: 32rpx 0;
|
}
|
|
.list-foot-text {
|
font-size: 24rpx;
|
line-height: 1;
|
color: #cbd5e1;
|
}
|
|
/* ==================== 图标（内联 base64 SVG） ==================== */
|
|
.icon {
|
flex-shrink: 0;
|
background-repeat: no-repeat;
|
background-position: center center;
|
background-size: 100% 100%;
|
}
|
|
/* 默认用户占位（#CBD5E1） */
|
.icon-user {
|
width: 68rpx;
|
height: 68rpx;
|
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQ0JENUUxIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCI+PHBhdGggZD0iTTE5IDIxdi0yYTQgNCAwIDAgMC00LTRIOWE0IDQgMCAwIDAtNCA0djIiLz48Y2lyY2xlIGN4PSIxMiIgY3k9IjciIHI9IjQiLz48L3N2Zz4=');
|
}
|
|
/* 上级大头像占位（#CBD5E1） */
|
.icon-user-lg {
|
width: 120rpx;
|
height: 120rpx;
|
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjQ0JENUUxIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCI+PHBhdGggZD0iTTE5IDIxdi0yYTQgNCAwIDAgMC00LTRIOWE0IDQgMCAwIDAtNCA0djIiLz48Y2lyY2xlIGN4PSIxMiIgY3k9IjciIHI9IjQiLz48L3N2Zz4=');
|
}
|
|
/* 空态图标：邀请好友（#CBD5E1） */
|
.icon-empty-invite {
|
width: 96rpx;
|
height: 96rpx;
|
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjY2JkNWUxIiBzdHJva2Utd2lkdGg9IjEuNiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cGF0aCBkPSJNMTUgMjF2LTJhNCA0IDAgMCAwLTQtNEg2YTQgNCAwIDAgMC00IDR2MiIvPjxjaXJjbGUgY3g9IjguNSIgY3k9IjciIHI9IjQiLz48cGF0aCBkPSJNMTkgOHY2Ii8+PHBhdGggZD0iTTIyIDExaC02Ii8+PC9zdmc+');
|
}
|
|
/* 空态图标：暂无上级（#CBD5E1） */
|
.icon-empty-referrer {
|
width: 96rpx;
|
height: 96rpx;
|
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjY2JkNWUxIiBzdHJva2Utd2lkdGg9IjEuNiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIj48cGF0aCBkPSJNMTkgMjF2LTJhNCA0IDAgMCAwLTQtNEg5YTQgNCAwIDAgMC00IDR2MiIvPjxjaXJjbGUgY3g9IjEyIiBjeT0iNyIgcj0iNCIvPjwvc3ZnPg==');
|
}
|
</style>
|
