You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
810 lines
20 KiB
810 lines
20 KiB
<template>
|
|
<view class="invite-page">
|
|
<view class="ambient ambient-one"></view>
|
|
<view class="ambient ambient-two"></view>
|
|
<view class="ambient ambient-three"></view>
|
|
|
|
<view class="back-btn glass-card" @tap="goBack">
|
|
<text class="back-arrow">‹</text>
|
|
<text>返回</text>
|
|
</view>
|
|
|
|
<view class="invite-hero glass-card">
|
|
<view class="hero-copy">
|
|
<view class="invite-badge">半径里邀友计划</view>
|
|
<view class="invite-title">叫上好友一起来省钱</view>
|
|
<view class="invite-subtitle">{{activityDesc}}</view>
|
|
<view class="reward-panel" :class="{'reward-panel-empty': !hasRewardActivity}">
|
|
<view class="reward-label">{{hasRewardActivity ? '当前区域奖励' : '当前区域'}}</view>
|
|
<view class="reward-amount" v-if="hasRewardActivity">¥{{formatAmount(rewardAmount)}}</view>
|
|
<view class="reward-empty-text" v-else>暂无拉新奖励活动</view>
|
|
</view>
|
|
</view>
|
|
<view class="hero-ip">
|
|
<view class="ip-halo"></view>
|
|
<image class="squirrel" src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/f7227759d693497a8beab87ff437a875.png" mode="aspectFit"></image>
|
|
<view class="sticker sticker-a">好友 +1</view>
|
|
<view class="sticker sticker-b">现金奖励</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="rule-card glass-card">
|
|
<view class="section-title">奖励规则</view>
|
|
<view class="rule-grid">
|
|
<view class="rule-item">
|
|
<text class="rule-dot">1</text>
|
|
<text>新用户首次注册并绑定手机号才可计奖</text>
|
|
</view>
|
|
<view class="rule-item">
|
|
<text class="rule-dot">2</text>
|
|
<text>同一手机号、同一设备只奖励一次</text>
|
|
</view>
|
|
<view class="rule-item">
|
|
<text class="rule-dot">3</text>
|
|
<text>好友需在分享时所在区域范围内登录</text>
|
|
</view>
|
|
<view class="rule-item">
|
|
<text class="rule-dot">4</text>
|
|
<text>奖励通过微信商家转账发放到微信零钱</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view v-if="hasRewardActivity" class="auth-card glass-card">
|
|
<view>
|
|
<view class="section-title">微信收款授权</view>
|
|
<view class="auth-desc">{{transferAuthDesc}}</view>
|
|
</view>
|
|
<view class="auth-action" :class="{'auth-action-done': isTransferAuthorized}" @tap="openTransferAuth">
|
|
{{isTransferAuthorized ? '已开通' : '开通免确认收款'}}
|
|
</view>
|
|
</view>
|
|
|
|
<button class="share-btn" :class="{'share-btn-disabled': !hasRewardActivity}" :disabled="!hasRewardActivity" open-type="share">
|
|
{{hasRewardActivity ? '立即邀请好友' : '暂无活动'}}
|
|
</button>
|
|
|
|
<view class="record-card glass-card">
|
|
<view class="record-head">
|
|
<view>
|
|
<view class="section-title">我的拉新记录</view>
|
|
<view class="record-subtitle">只展示已进入奖励处理流程的记录</view>
|
|
</view>
|
|
<view class="record-refresh" @tap="refreshRecords">刷新</view>
|
|
</view>
|
|
<view v-if="records.length === 0 && !recordLoading" class="record-empty">
|
|
暂无拉新奖励记录
|
|
</view>
|
|
<view v-for="item in records" :key="item.id" class="record-item">
|
|
<view class="record-row">
|
|
<text class="record-phone">{{maskMobile(item.invitedMobile)}}</text>
|
|
<text class="record-status" :class="'record-status-' + Number(item.status)">{{statusText(item.status)}}</text>
|
|
</view>
|
|
<view class="record-row record-row-sub">
|
|
<text>奖励金额 ¥{{formatAmount(item.amount)}}</text>
|
|
<text>{{item.createTime || ''}}</text>
|
|
</view>
|
|
<view v-if="item.failReason" class="record-reason">{{item.failReason}}</view>
|
|
<view v-if="canConfirmTransfer(item)" class="confirm-transfer-btn" @tap="confirmTransfer(item)">
|
|
确认收款
|
|
</view>
|
|
</view>
|
|
<view v-if="records.length > 0" class="record-more" @tap="loadMoreRecords">
|
|
{{recordLoading ? '加载中...' : (recordFinished ? '没有更多了' : '加载更多')}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { buildInviteHomeSharePath } from '@/utils/sharePath.js'
|
|
import { requireLoginToCurrentPage } from '@/utils/authRedirect.js'
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
records: [],
|
|
recordPageNumber: 1,
|
|
recordPageSize: 10,
|
|
recordTotal: 0,
|
|
recordLoading: false,
|
|
recordFinished: false,
|
|
rewardAmount: 0,
|
|
configLoaded: false,
|
|
transferAuth: {
|
|
state: '',
|
|
authNo: '',
|
|
authId: '',
|
|
mchId: '',
|
|
appId: '',
|
|
packageInfo: ''
|
|
},
|
|
transferAuthLoading: false,
|
|
authStatusLoaded: false,
|
|
autoAuthTriggered: false
|
|
}
|
|
},
|
|
computed: {
|
|
hasRewardActivity() {
|
|
return Number(this.rewardAmount || 0) > 0
|
|
},
|
|
isTransferAuthorized() {
|
|
return this.transferAuth && this.transferAuth.state === 'TAKING_EFFECT'
|
|
},
|
|
transferAuthDesc() {
|
|
if (this.isTransferAuthorized) {
|
|
return '已授权微信收款，后续奖励将自动到账微信零钱。'
|
|
}
|
|
return '开通后无需每笔确认，好友完成注册奖励会自动发放到微信零钱。'
|
|
},
|
|
activityDesc() {
|
|
return this.hasRewardActivity
|
|
? '好友在当前区域完成新用户注册并绑定手机号后，你将获得现金奖励。'
|
|
: '当前区域暂未开启拉新奖励，活动开启后这里会第一时间展示金额。'
|
|
}
|
|
},
|
|
onLoad() {
|
|
if (!requireLoginToCurrentPage()) return
|
|
this.enableShareMenu()
|
|
this.loadInviteConfig()
|
|
this.loadTransferAuthStatus()
|
|
this.refreshRecords()
|
|
},
|
|
onReachBottom() {
|
|
this.loadMoreRecords()
|
|
},
|
|
onShareAppMessage() {
|
|
return {
|
|
title: '来半径里一起拼团，注册后我还能领现金奖励',
|
|
path: buildInviteHomeSharePath()
|
|
}
|
|
},
|
|
methods: {
|
|
goBack() {
|
|
const pages = getCurrentPages ? getCurrentPages() : []
|
|
if (pages && pages.length > 1) {
|
|
uni.navigateBack()
|
|
return
|
|
}
|
|
uni.switchTab({
|
|
url: '/pages/index/index',
|
|
fail: () => {
|
|
uni.redirectTo({
|
|
url: '/pages/index/index'
|
|
})
|
|
}
|
|
})
|
|
},
|
|
enableShareMenu() {
|
|
if (!uni.showShareMenu) return
|
|
uni.showShareMenu({
|
|
withShareTicket: true,
|
|
menus: ['shareAppMessage']
|
|
})
|
|
},
|
|
readCurrentRegionId() {
|
|
try {
|
|
const area = uni.getStorageSync('area')
|
|
if (!area) return ''
|
|
const data = typeof area === 'string' ? JSON.parse(area) : area
|
|
return data && data.id ? String(data.id) : ''
|
|
} catch (e) {
|
|
return ''
|
|
}
|
|
},
|
|
loadInviteConfig() {
|
|
const regionId = this.readCurrentRegionId()
|
|
if (!regionId) {
|
|
this.rewardAmount = 0
|
|
this.configLoaded = true
|
|
this.tryAutoOpenTransferAuth()
|
|
return
|
|
}
|
|
this.tui.request('/app/inviteReward/config', 'GET', {
|
|
regionId
|
|
}, false, true, true).then((res) => {
|
|
this.configLoaded = true
|
|
const config = res && res.code == 200 ? (res.result || null) : null
|
|
this.rewardAmount = config && Number(config.rewardAmount || 0) > 0 ? Number(config.rewardAmount || 0) : 0
|
|
this.tryAutoOpenTransferAuth()
|
|
}).catch(() => {
|
|
this.configLoaded = true
|
|
this.rewardAmount = 0
|
|
this.tryAutoOpenTransferAuth()
|
|
})
|
|
},
|
|
loadTransferAuthStatus() {
|
|
this.tui.request('/app/inviteReward/transferAuth/status', 'GET', {}, false, true, true).then((res) => {
|
|
if (res && res.code == 200 && res.result) {
|
|
this.transferAuth = Object.assign({}, this.transferAuth, res.result)
|
|
}
|
|
this.authStatusLoaded = true
|
|
this.tryAutoOpenTransferAuth()
|
|
}).catch(() => {
|
|
this.authStatusLoaded = true
|
|
this.tryAutoOpenTransferAuth()
|
|
})
|
|
},
|
|
tryAutoOpenTransferAuth() {
|
|
if (!this.configLoaded || !this.authStatusLoaded || this.autoAuthTriggered) return
|
|
if (!this.hasRewardActivity || this.isTransferAuthorized) return
|
|
this.autoAuthTriggered = true
|
|
setTimeout(() => this.openTransferAuth(), 300)
|
|
},
|
|
openTransferAuth() {
|
|
if (this.isTransferAuthorized || this.transferAuthLoading) return
|
|
this.transferAuthLoading = true
|
|
this.tui.request('/app/inviteReward/transferAuth/apply', 'POST', {}, false, true, true).then((res) => {
|
|
this.transferAuthLoading = false
|
|
if (!res || res.code != 200 || !res.result) {
|
|
this.tui.toast((res && res.message) || '收款授权申请失败')
|
|
return
|
|
}
|
|
this.transferAuth = Object.assign({}, this.transferAuth, res.result)
|
|
if (this.isTransferAuthorized) {
|
|
this.tui.toast('已开通自动收款')
|
|
return
|
|
}
|
|
this.requestMerchantTransferAuth(res.result)
|
|
}).catch(() => {
|
|
this.transferAuthLoading = false
|
|
this.tui.toast('收款授权申请失败')
|
|
})
|
|
},
|
|
requestMerchantTransferAuth(authInfo) {
|
|
const packageInfo = authInfo && authInfo.packageInfo
|
|
if (!packageInfo) {
|
|
this.tui.toast('缺少微信授权信息')
|
|
return
|
|
}
|
|
if (typeof wx === 'undefined' || !wx.requestMerchantTransfer) {
|
|
this.tui.toast('当前微信版本暂不支持收款授权')
|
|
return
|
|
}
|
|
wx.requestMerchantTransfer({
|
|
mchId: authInfo.mchId,
|
|
appId: authInfo.appId,
|
|
'package': packageInfo,
|
|
success: () => {
|
|
this.tui.toast('授权完成，正在同步状态', 1600, true)
|
|
},
|
|
fail: () => {
|
|
this.tui.toast('未完成收款授权')
|
|
},
|
|
complete: () => {
|
|
setTimeout(() => this.refreshTransferAuth(2), 1500)
|
|
}
|
|
})
|
|
},
|
|
refreshTransferAuth(retryLeft = 0) {
|
|
this.tui.request('/app/inviteReward/transferAuth/query', 'POST', {}, false, true, true).then((res) => {
|
|
if (res && res.code == 200 && res.result) {
|
|
this.transferAuth = Object.assign({}, this.transferAuth, res.result)
|
|
if (this.isTransferAuthorized) {
|
|
this.tui.toast('已开通自动收款')
|
|
} else if (retryLeft > 0) {
|
|
setTimeout(() => this.refreshTransferAuth(retryLeft - 1), 1500)
|
|
}
|
|
}
|
|
})
|
|
},
|
|
refreshRecords() {
|
|
this.recordPageNumber = 1
|
|
this.recordFinished = false
|
|
this.loadRecords(true)
|
|
},
|
|
loadMoreRecords() {
|
|
if (this.recordLoading || this.recordFinished) return
|
|
this.recordPageNumber += 1
|
|
this.loadRecords(false)
|
|
},
|
|
loadRecords(reset) {
|
|
this.recordLoading = true
|
|
this.tui.request('/app/inviteReward/my/page', 'GET', {
|
|
pageNumber: this.recordPageNumber,
|
|
pageSize: this.recordPageSize
|
|
}, false, true, true).then((res) => {
|
|
this.recordLoading = false
|
|
if (res.code != 200 || !res.result) {
|
|
if (!reset) this.recordPageNumber -= 1
|
|
this.tui.toast(res.message || '拉新记录加载失败')
|
|
return
|
|
}
|
|
const page = res.result || {}
|
|
const nextRecords = page.records || []
|
|
this.recordTotal = Number(page.total || 0)
|
|
this.records = reset ? nextRecords : this.records.concat(nextRecords)
|
|
this.recordFinished = this.records.length >= this.recordTotal || nextRecords.length < this.recordPageSize
|
|
}).catch(() => {
|
|
this.recordLoading = false
|
|
if (!reset) this.recordPageNumber -= 1
|
|
this.tui.toast('拉新记录加载失败')
|
|
})
|
|
},
|
|
statusText(status) {
|
|
const map = {
|
|
0: '处理中',
|
|
1: '已发放',
|
|
2: '发放失败',
|
|
3: '已跳过'
|
|
}
|
|
return map[Number(status)] || '未知'
|
|
},
|
|
formatAmount(value) {
|
|
const num = Number(value || 0)
|
|
return num.toFixed(2)
|
|
},
|
|
maskMobile(mobile) {
|
|
const value = String(mobile || '')
|
|
if (value.length < 7) return value || '新用户'
|
|
return value.slice(0, 3) + '****' + value.slice(-4)
|
|
},
|
|
parseWxResponse(item) {
|
|
try {
|
|
return item && item.wxResponse ? JSON.parse(item.wxResponse) : {}
|
|
} catch (e) {
|
|
return {}
|
|
}
|
|
},
|
|
transferPackageInfo(item) {
|
|
const wxResponse = this.parseWxResponse(item)
|
|
return wxResponse.package_info || ''
|
|
},
|
|
canConfirmTransfer(item) {
|
|
return Number(item && item.status) === 0 && !!this.transferPackageInfo(item)
|
|
},
|
|
confirmTransfer(item) {
|
|
const packageInfo = this.transferPackageInfo(item)
|
|
if (!packageInfo) {
|
|
this.tui.toast('缺少收款确认信息，请刷新后再试')
|
|
return
|
|
}
|
|
if (typeof wx === 'undefined' || !wx.openBusinessView) {
|
|
this.tui.toast('当前微信版本暂不支持确认收款')
|
|
return
|
|
}
|
|
wx.openBusinessView({
|
|
businessType: 'weappBusinessTransfer',
|
|
extraData: {
|
|
mchId: WECHAT_TRANSFER_MCH_ID,
|
|
appId: WECHAT_TRANSFER_APP_ID,
|
|
package: packageInfo
|
|
},
|
|
success: () => {
|
|
this.tui.toast('请按微信页面提示确认收款', 1600, true)
|
|
setTimeout(() => this.refreshRecords(), 1200)
|
|
},
|
|
fail: () => {
|
|
this.tui.toast('未完成收款确认')
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.invite-page {
|
|
position: relative;
|
|
min-height: 100vh;
|
|
overflow: hidden;
|
|
padding: 132rpx 34rpx 56rpx;
|
|
box-sizing: border-box;
|
|
background:
|
|
radial-gradient(circle at 12% 8%, rgba(255, 255, 255, 0.96) 0, rgba(255, 255, 255, 0) 260rpx),
|
|
radial-gradient(circle at 84% 0, rgba(199, 248, 219, 0.72) 0, rgba(199, 248, 219, 0) 300rpx),
|
|
linear-gradient(160deg, #f8f5e8 0%, #eefbe8 42%, #e7f8ef 72%, #fbf7ed 100%);
|
|
color: #123b31;
|
|
}
|
|
|
|
.ambient {
|
|
position: absolute;
|
|
border-radius: 999rpx;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.ambient-one {
|
|
top: 88rpx;
|
|
left: -94rpx;
|
|
width: 270rpx;
|
|
height: 270rpx;
|
|
background: rgba(255, 255, 255, 0.58);
|
|
box-shadow: 0 0 90rpx rgba(255, 255, 255, 0.78);
|
|
}
|
|
|
|
.ambient-two {
|
|
top: 268rpx;
|
|
right: -84rpx;
|
|
width: 230rpx;
|
|
height: 230rpx;
|
|
background: rgba(166, 255, 234, 0.42);
|
|
box-shadow: 0 0 88rpx rgba(42, 191, 139, 0.14);
|
|
}
|
|
|
|
.ambient-three {
|
|
left: 84rpx;
|
|
bottom: 190rpx;
|
|
width: 150rpx;
|
|
height: 150rpx;
|
|
background: rgba(255, 240, 199, 0.48);
|
|
box-shadow: 0 0 76rpx rgba(255, 213, 127, 0.24);
|
|
}
|
|
|
|
.glass-card {
|
|
position: relative;
|
|
z-index: 1;
|
|
box-sizing: border-box;
|
|
border: 1rpx solid rgba(255, 255, 255, 0.72);
|
|
background: rgba(255, 255, 255, 0.58);
|
|
box-shadow:
|
|
0 24rpx 64rpx rgba(62, 116, 91, 0.14),
|
|
inset 0 1rpx 0 rgba(255, 255, 255, 0.76);
|
|
backdrop-filter: blur(24rpx);
|
|
}
|
|
|
|
.back-btn {
|
|
position: absolute;
|
|
top: 62rpx;
|
|
left: 34rpx;
|
|
z-index: 5;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 4rpx;
|
|
height: 56rpx;
|
|
padding: 0 20rpx 0 14rpx;
|
|
border-radius: 999rpx;
|
|
color: #123b31;
|
|
font-size: 24rpx;
|
|
font-weight: 800;
|
|
}
|
|
|
|
.back-arrow {
|
|
font-size: 40rpx;
|
|
line-height: 1;
|
|
transform: translateY(-2rpx);
|
|
}
|
|
|
|
.invite-hero {
|
|
display: flex;
|
|
min-height: 392rpx;
|
|
padding: 34rpx 30rpx 28rpx;
|
|
overflow: hidden;
|
|
border-radius: 46rpx;
|
|
}
|
|
|
|
.hero-copy {
|
|
position: relative;
|
|
z-index: 2;
|
|
flex: 1;
|
|
min-width: 0;
|
|
}
|
|
|
|
.invite-badge {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
height: 46rpx;
|
|
padding: 0 18rpx;
|
|
border-radius: 999rpx;
|
|
background: rgba(18, 59, 49, 0.92);
|
|
color: #fff5cf;
|
|
font-size: 22rpx;
|
|
font-weight: 800;
|
|
}
|
|
|
|
.invite-title {
|
|
width: 420rpx;
|
|
margin-top: 28rpx;
|
|
color: #17372d;
|
|
font-size: 43rpx;
|
|
font-weight: 900;
|
|
line-height: 1.22;
|
|
}
|
|
|
|
.invite-subtitle {
|
|
width: 410rpx;
|
|
margin-top: 18rpx;
|
|
color: rgba(43, 83, 70, 0.66);
|
|
font-size: 25rpx;
|
|
line-height: 1.58;
|
|
}
|
|
|
|
.reward-panel {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 18rpx;
|
|
margin-top: 26rpx;
|
|
padding: 14rpx 18rpx;
|
|
border-radius: 999rpx;
|
|
background: linear-gradient(90deg, rgba(227, 255, 150, 0.95), rgba(166, 255, 234, 0.95));
|
|
box-shadow: 0 16rpx 36rpx rgba(42, 191, 139, 0.18);
|
|
}
|
|
|
|
.reward-panel-empty {
|
|
background: rgba(255, 255, 255, 0.66);
|
|
box-shadow: none;
|
|
}
|
|
|
|
.reward-label {
|
|
color: rgba(7, 61, 51, 0.7);
|
|
font-size: 22rpx;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.reward-amount {
|
|
color: #073d33;
|
|
font-size: 36rpx;
|
|
font-weight: 950;
|
|
line-height: 1;
|
|
}
|
|
|
|
.reward-empty-text {
|
|
color: rgba(43, 83, 70, 0.62);
|
|
font-size: 24rpx;
|
|
font-weight: 800;
|
|
}
|
|
|
|
.hero-ip {
|
|
position: absolute;
|
|
right: -18rpx;
|
|
bottom: 8rpx;
|
|
width: 260rpx;
|
|
height: 300rpx;
|
|
}
|
|
|
|
.ip-halo {
|
|
position: absolute;
|
|
left: 22rpx;
|
|
bottom: 42rpx;
|
|
width: 220rpx;
|
|
height: 150rpx;
|
|
border-radius: 50%;
|
|
background: radial-gradient(circle, rgba(255, 255, 255, 0.82), rgba(245, 225, 177, 0.18) 64%, rgba(255, 255, 255, 0));
|
|
}
|
|
|
|
.squirrel {
|
|
position: absolute;
|
|
right: 22rpx;
|
|
bottom: 28rpx;
|
|
width: 150rpx;
|
|
height: 150rpx;
|
|
filter: drop-shadow(0 28rpx 28rpx rgba(80, 103, 79, 0.16));
|
|
}
|
|
|
|
.sticker {
|
|
position: absolute;
|
|
z-index: 2;
|
|
padding: 10rpx 16rpx;
|
|
border: 1rpx solid rgba(255, 255, 255, 0.76);
|
|
border-radius: 999rpx;
|
|
background: rgba(255, 255, 255, 0.62);
|
|
box-shadow: 0 14rpx 38rpx rgba(93, 132, 101, 0.12);
|
|
color: rgba(26, 69, 55, 0.72);
|
|
font-size: 21rpx;
|
|
font-weight: 800;
|
|
}
|
|
|
|
.sticker-a {
|
|
right: 150rpx;
|
|
top: 58rpx;
|
|
transform: rotate(-7deg);
|
|
}
|
|
|
|
.sticker-b {
|
|
right: 18rpx;
|
|
top: 26rpx;
|
|
color: #8a6834;
|
|
transform: rotate(5deg);
|
|
}
|
|
|
|
.rule-card {
|
|
margin-top: 28rpx;
|
|
padding: 30rpx;
|
|
border-radius: 38rpx;
|
|
}
|
|
|
|
.section-title {
|
|
color: #17372d;
|
|
font-size: 32rpx;
|
|
font-weight: 900;
|
|
}
|
|
|
|
.rule-grid {
|
|
margin-top: 22rpx;
|
|
}
|
|
|
|
.rule-item {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
gap: 16rpx;
|
|
margin-top: 18rpx;
|
|
color: rgba(18, 59, 49, 0.76);
|
|
font-size: 25rpx;
|
|
line-height: 1.55;
|
|
}
|
|
|
|
.rule-dot {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
flex-shrink: 0;
|
|
width: 34rpx;
|
|
height: 34rpx;
|
|
margin-top: 2rpx;
|
|
border-radius: 14rpx;
|
|
background: rgba(42, 191, 139, 0.14);
|
|
color: #15956a;
|
|
font-size: 21rpx;
|
|
font-weight: 900;
|
|
}
|
|
|
|
.auth-card {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
gap: 22rpx;
|
|
margin-top: 28rpx;
|
|
padding: 30rpx;
|
|
border-radius: 38rpx;
|
|
}
|
|
|
|
.auth-desc {
|
|
margin-top: 12rpx;
|
|
color: rgba(18, 59, 49, 0.58);
|
|
font-size: 24rpx;
|
|
line-height: 1.5;
|
|
}
|
|
|
|
.auth-action {
|
|
flex-shrink: 0;
|
|
padding: 16rpx 24rpx;
|
|
border-radius: 999rpx;
|
|
background: linear-gradient(90deg, #dcff8d, #8fffe7);
|
|
color: #0b5b47;
|
|
font-size: 24rpx;
|
|
font-weight: 900;
|
|
box-shadow: 0 12rpx 28rpx rgba(44, 175, 121, 0.18);
|
|
}
|
|
|
|
.auth-action-done {
|
|
background: rgba(42, 191, 139, 0.12);
|
|
color: #198861;
|
|
box-shadow: none;
|
|
}
|
|
|
|
.share-btn {
|
|
position: relative;
|
|
z-index: 1;
|
|
margin-top: 34rpx;
|
|
height: 96rpx;
|
|
line-height: 96rpx;
|
|
border-radius: 999rpx;
|
|
border: 0;
|
|
background: linear-gradient(90deg, #123b31, #2abf8b);
|
|
color: #ffffff;
|
|
font-size: 31rpx;
|
|
font-weight: 900;
|
|
box-shadow: 0 22rpx 42rpx rgba(42, 191, 139, 0.3);
|
|
}
|
|
|
|
.share-btn::after {
|
|
border: 0;
|
|
}
|
|
|
|
.share-btn-disabled {
|
|
background: rgba(255, 255, 255, 0.64);
|
|
color: rgba(43, 83, 70, 0.48);
|
|
box-shadow: none;
|
|
}
|
|
|
|
.record-card {
|
|
margin-top: 34rpx;
|
|
padding: 32rpx;
|
|
border-radius: 38rpx;
|
|
}
|
|
|
|
.record-head {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
margin-bottom: 20rpx;
|
|
}
|
|
|
|
.record-subtitle {
|
|
margin-top: 8rpx;
|
|
color: rgba(18, 59, 49, 0.52);
|
|
font-size: 23rpx;
|
|
}
|
|
|
|
.record-refresh {
|
|
padding: 10rpx 22rpx;
|
|
border-radius: 999rpx;
|
|
background: rgba(42, 191, 139, 0.12);
|
|
color: #198861;
|
|
font-size: 24rpx;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.record-empty {
|
|
padding: 54rpx 0;
|
|
color: rgba(18, 59, 49, 0.48);
|
|
font-size: 26rpx;
|
|
text-align: center;
|
|
}
|
|
|
|
.record-item {
|
|
padding: 22rpx 0;
|
|
border-top: 1rpx solid rgba(18, 59, 49, 0.08);
|
|
}
|
|
|
|
.record-row {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
gap: 18rpx;
|
|
}
|
|
|
|
.record-row-sub {
|
|
margin-top: 12rpx;
|
|
color: rgba(18, 59, 49, 0.58);
|
|
font-size: 24rpx;
|
|
}
|
|
|
|
.record-phone {
|
|
font-size: 29rpx;
|
|
font-weight: 800;
|
|
}
|
|
|
|
.record-status {
|
|
padding: 6rpx 16rpx;
|
|
border-radius: 999rpx;
|
|
background: #edf3f1;
|
|
color: #50615c;
|
|
font-size: 22rpx;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.record-status-0 {
|
|
background: #eaf3ff;
|
|
color: #2f74c0;
|
|
}
|
|
|
|
.record-status-1 {
|
|
background: #e9fbf2;
|
|
color: #1b9a66;
|
|
}
|
|
|
|
.record-status-2 {
|
|
background: #fff0f0;
|
|
color: #d94f4f;
|
|
}
|
|
|
|
.record-reason {
|
|
margin-top: 12rpx;
|
|
color: #d94f4f;
|
|
font-size: 23rpx;
|
|
line-height: 1.5;
|
|
}
|
|
|
|
.confirm-transfer-btn {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
height: 56rpx;
|
|
margin-top: 16rpx;
|
|
padding: 0 24rpx;
|
|
border-radius: 999rpx;
|
|
background: linear-gradient(90deg, #dcff8d, #8fffe7);
|
|
color: #0b5b47;
|
|
font-size: 24rpx;
|
|
font-weight: 900;
|
|
box-shadow: 0 12rpx 28rpx rgba(44, 175, 121, 0.18);
|
|
}
|
|
|
|
.record-more {
|
|
padding-top: 24rpx;
|
|
border-top: 1rpx solid rgba(18, 59, 49, 0.08);
|
|
color: rgba(18, 59, 49, 0.58);
|
|
font-size: 25rpx;
|
|
text-align: center;
|
|
}
|
|
</style>
|
|
|