|
|
|
@ -9,21 +9,38 @@ |
|
|
|
<!-- 时间奖励值 --> |
|
|
|
<view class="time-reward" @click="showExchangeModal"> |
|
|
|
<view class="reward-icon"> |
|
|
|
<nmr-icon name="jifenduihuan" style="margin-right: 10rpx;margin-top: 3rpx;" size="40" |
|
|
|
color="white"></nmr-icon>兑换奖励 |
|
|
|
<nmr-icon |
|
|
|
name="jifenduihuan" |
|
|
|
style="margin-right: 10rpx; margin-top: 3rpx" |
|
|
|
size="40" |
|
|
|
color="white" |
|
|
|
></nmr-icon |
|
|
|
>兑换奖励 |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- 筛选选项 --> |
|
|
|
<view class="filter-tabs"> |
|
|
|
<view class="tab-item" :class="[{ active: currentTab === 'all' }]" @click="switchTab('all')"> |
|
|
|
<view |
|
|
|
class="tab-item" |
|
|
|
:class="[{ active: currentTab === 'all' }]" |
|
|
|
@click="switchTab('all')" |
|
|
|
> |
|
|
|
全部 |
|
|
|
</view> |
|
|
|
<view class="tab-item" :class="[{ active: currentTab === 'in' }]" @click="switchTab('in')"> |
|
|
|
<view |
|
|
|
class="tab-item" |
|
|
|
:class="[{ active: currentTab === 'in' }]" |
|
|
|
@click="switchTab('in')" |
|
|
|
> |
|
|
|
收入 |
|
|
|
</view> |
|
|
|
<view class="tab-item" :class="[{ active: currentTab === 'out' }]" @click="switchTab('out')"> |
|
|
|
<view |
|
|
|
class="tab-item" |
|
|
|
:class="[{ active: currentTab === 'out' }]" |
|
|
|
@click="switchTab('out')" |
|
|
|
> |
|
|
|
支出 |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
@ -31,9 +48,16 @@ |
|
|
|
<!-- 积分记录列表 --> |
|
|
|
<scroll-view class="points-list" scroll-y="true" @scrolltolower="loadMore"> |
|
|
|
<template v-if="pointsList.length"> |
|
|
|
<view class="record-item" v-for="(item, index) in pointsList" :key="index"> |
|
|
|
<view |
|
|
|
class="record-item" |
|
|
|
v-for="(item, index) in pointsList" |
|
|
|
:key="index" |
|
|
|
> |
|
|
|
<view class="record-left"> |
|
|
|
<view class="record-icon" :class="item.fromType === 'in' ? 'income' : 'expense'"> |
|
|
|
<view |
|
|
|
class="record-icon" |
|
|
|
:class="item.fromType === 'in' ? 'income' : 'expense'" |
|
|
|
> |
|
|
|
<nmr-icon name="jifen" size="60" color="#333"></nmr-icon> |
|
|
|
</view> |
|
|
|
<view class="record-info"> |
|
|
|
@ -43,7 +67,10 @@ |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="record-right"> |
|
|
|
<view class="record-points" :class="item.fromType === 'in' ? 'income' : 'expense'"> |
|
|
|
<view |
|
|
|
class="record-points" |
|
|
|
:class="item.fromType === 'in' ? 'income' : 'expense'" |
|
|
|
> |
|
|
|
{{ item.points }} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
@ -64,9 +91,11 @@ |
|
|
|
|
|
|
|
<!-- 空状态 --> |
|
|
|
<view class="empty-state" v-if="pointsList.length === 0 && !loading"> |
|
|
|
<image class="empty-icon" |
|
|
|
<image |
|
|
|
class="empty-icon" |
|
|
|
src="https://epic.js-dyyj.com/uploads/20250808/c16267f9cc2b7a68bf23713b5847987e.png" |
|
|
|
mode="aspectFit"></image> |
|
|
|
mode="aspectFit" |
|
|
|
></image> |
|
|
|
<text class="empty-text">暂无积分记录</text> |
|
|
|
</view> |
|
|
|
</scroll-view> |
|
|
|
@ -84,21 +113,29 @@ |
|
|
|
<view class="modal-content"> |
|
|
|
<view class="current-reward"> |
|
|
|
<text class="reward-label">当前时间奖励值：</text> |
|
|
|
<text class="reward-value">{{ userInfo&&userInfo.hourValue||0 }}</text> |
|
|
|
<text class="reward-value">{{ |
|
|
|
(userInfo && userInfo.hourValue) || 0 |
|
|
|
}}</text> |
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="exchange-form"> |
|
|
|
<view class="form-item"> |
|
|
|
<text class="form-label">兑换数量：</text> |
|
|
|
<input class="form-input" v-model="exchangeAmount" type="number" placeholder="请输入兑换数量" /> |
|
|
|
<input |
|
|
|
class="form-input" |
|
|
|
v-model="exchangeAmount" |
|
|
|
type="number" |
|
|
|
placeholder="请输入兑换数量" |
|
|
|
/> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="exchange-rules"> |
|
|
|
<text class="rules-title">兑换规则：</text> |
|
|
|
<view class="rules-list"> |
|
|
|
<text class="rule-item">• 1个时间奖励值 = {{pointInfo.points||0}}积分</text> |
|
|
|
|
|
|
|
<text class="rule-item" |
|
|
|
>• 1个时间奖励值 = {{ pointInfo.points || 0 }}积分</text |
|
|
|
> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
@ -113,7 +150,7 @@ |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
export default { |
|
|
|
export default { |
|
|
|
data() { |
|
|
|
return { |
|
|
|
totalPoints: 0, |
|
|
|
@ -126,14 +163,12 @@ |
|
|
|
refreshing: false, |
|
|
|
userInfo: null, |
|
|
|
timeReward: 0, |
|
|
|
exchangeAmount: '', |
|
|
|
exchangeAmount: "", |
|
|
|
exchangeResult: 0, |
|
|
|
pointInfo: null |
|
|
|
pointInfo: null, |
|
|
|
}; |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
onLoad() { |
|
|
|
this.getUserInfo(); |
|
|
|
this.loadPointsData(); |
|
|
|
@ -142,12 +177,12 @@ |
|
|
|
|
|
|
|
methods: { |
|
|
|
getUserInfo() { |
|
|
|
|
|
|
|
this.Post({}, "/framework/user/getInfo", "DES").then((res) => { |
|
|
|
this.userInfo = |
|
|
|
(uni.getStorageSync("userInfo") && |
|
|
|
JSON.parse(uni.getStorageSync("userInfo"))) || |
|
|
|
this.$store.state.user.userInfo || {}; |
|
|
|
this.$store.state.user.userInfo || |
|
|
|
{}; |
|
|
|
res.data.token = this.userInfo.token; |
|
|
|
uni.setStorageSync("userInfo", JSON.stringify(res.data)); |
|
|
|
this.userInfo = res.data; |
|
|
|
@ -176,13 +211,12 @@ |
|
|
|
// 获取总积分 |
|
|
|
async getTotalPoints() { |
|
|
|
try { |
|
|
|
this.Post({}, '/framework/points/getLastBalance', 'DES').then(res => { |
|
|
|
this.Post({}, "/framework/points/getLastBalance", "DES").then((res) => { |
|
|
|
if (res.code === 200) { |
|
|
|
this.pointInfo = res.data |
|
|
|
this.pointInfo = res.data; |
|
|
|
this.totalPoints = res.data.balance || 0; |
|
|
|
} |
|
|
|
}) |
|
|
|
|
|
|
|
}); |
|
|
|
} catch (error) { |
|
|
|
console.error("获取总积分失败:", error); |
|
|
|
} |
|
|
|
@ -204,9 +238,8 @@ |
|
|
|
params.fromType = this.currentTab; |
|
|
|
} |
|
|
|
|
|
|
|
this.Post(params, '/framework/points/list', 'DES') |
|
|
|
.then(res => { |
|
|
|
console.log(res) |
|
|
|
this.Post(params, "/framework/points/list", "DES").then((res) => { |
|
|
|
console.log(res); |
|
|
|
if (res.code === 200) { |
|
|
|
const newData = res.rows || []; |
|
|
|
|
|
|
|
@ -227,9 +260,7 @@ |
|
|
|
icon: "none", |
|
|
|
}); |
|
|
|
} |
|
|
|
}) |
|
|
|
|
|
|
|
|
|
|
|
}); |
|
|
|
} catch (error) { |
|
|
|
console.error("加载积分记录失败:", error); |
|
|
|
uni.showToast({ |
|
|
|
@ -257,10 +288,6 @@ |
|
|
|
this.getTotalPoints(); |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 显示兑换弹窗 |
|
|
|
showExchangeModal() { |
|
|
|
this.$refs.exchangePopup.open(); |
|
|
|
@ -269,27 +296,27 @@ |
|
|
|
// 关闭兑换弹窗 |
|
|
|
closeExchangeModal() { |
|
|
|
this.$refs.exchangePopup.close(); |
|
|
|
this.exchangeAmount = ''; |
|
|
|
this.exchangeAmount = ""; |
|
|
|
this.exchangeResult = 0; |
|
|
|
}, |
|
|
|
async confirmExchange() { |
|
|
|
if (parseInt(this.exchangeAmount) > this.userInfo.hourValue) { |
|
|
|
uni.showToast({ |
|
|
|
title: '兑换值大于可用值', |
|
|
|
icon: 'none' |
|
|
|
}) |
|
|
|
return |
|
|
|
title: "兑换值大于可用值", |
|
|
|
icon: "none", |
|
|
|
}); |
|
|
|
return; |
|
|
|
} |
|
|
|
try { |
|
|
|
const params = { |
|
|
|
hour: parseInt(this.exchangeAmount), |
|
|
|
method: 'post' |
|
|
|
method: "post", |
|
|
|
}; |
|
|
|
this.Post(params, '/framework/points/hourChange', 'DES').then(res => { |
|
|
|
this.Post(params, "/framework/points/hourChange", "DES").then((res) => { |
|
|
|
if (res.code === 200) { |
|
|
|
uni.showToast({ |
|
|
|
title: '兑换成功', |
|
|
|
icon: 'success' |
|
|
|
title: "兑换成功", |
|
|
|
icon: "success", |
|
|
|
}); |
|
|
|
|
|
|
|
// 刷新数据 |
|
|
|
@ -300,16 +327,16 @@ |
|
|
|
this.closeExchangeModal(); |
|
|
|
} else { |
|
|
|
uni.showToast({ |
|
|
|
title: res.msg || '兑换失败', |
|
|
|
icon: 'none' |
|
|
|
title: res.msg || "兑换失败", |
|
|
|
icon: "none", |
|
|
|
}); |
|
|
|
} |
|
|
|
}); |
|
|
|
} catch (error) { |
|
|
|
console.error('兑换失败:', error); |
|
|
|
console.error("兑换失败:", error); |
|
|
|
uni.showToast({ |
|
|
|
title: '网络错误，请重试', |
|
|
|
icon: 'none' |
|
|
|
title: "网络错误，请重试", |
|
|
|
icon: "none", |
|
|
|
}); |
|
|
|
} |
|
|
|
}, |
|
|
|
@ -344,17 +371,17 @@ |
|
|
|
.padStart(2, "0")}:${date.getMinutes().toString().padStart(2, "0")}`; |
|
|
|
}, |
|
|
|
}, |
|
|
|
}; |
|
|
|
}; |
|
|
|
</script> |
|
|
|
|
|
|
|
<style scoped> |
|
|
|
.points-detail-page { |
|
|
|
.points-detail-page { |
|
|
|
min-height: 100vh; |
|
|
|
background-color: #f5f5f5; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
/* 导航栏 */ |
|
|
|
.nav-bar { |
|
|
|
/* 导航栏 */ |
|
|
|
.nav-bar { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
justify-content: space-between; |
|
|
|
@ -362,59 +389,59 @@ |
|
|
|
padding: 0 32rpx; |
|
|
|
background-color: #fff; |
|
|
|
border-bottom: 1rpx solid #eee; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.nav-back { |
|
|
|
.nav-back { |
|
|
|
width: 60rpx; |
|
|
|
height: 60rpx; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
justify-content: center; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.nav-back .iconfont { |
|
|
|
.nav-back .iconfont { |
|
|
|
font-size: 36rpx; |
|
|
|
color: #333; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.nav-title { |
|
|
|
.nav-title { |
|
|
|
font-size: 36rpx; |
|
|
|
font-weight: 600; |
|
|
|
color: #333; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.nav-placeholder { |
|
|
|
.nav-placeholder { |
|
|
|
width: 60rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
/* 积分总览 */ |
|
|
|
.points-overview { |
|
|
|
/* 积分总览 */ |
|
|
|
.points-overview { |
|
|
|
background: linear-gradient(135deg, #77f3f9 0%, #764ba2 100%); |
|
|
|
padding: 60rpx 32rpx; |
|
|
|
text-align: center; |
|
|
|
position: relative; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.total-points { |
|
|
|
.total-points { |
|
|
|
display: flex; |
|
|
|
flex-direction: column; |
|
|
|
align-items: center; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.points-number { |
|
|
|
.points-number { |
|
|
|
font-size: 72rpx; |
|
|
|
font-weight: bold; |
|
|
|
color: #fff; |
|
|
|
margin-bottom: 12rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.points-label { |
|
|
|
.points-label { |
|
|
|
font-size: 28rpx; |
|
|
|
color: rgba(255, 255, 255, 0.8); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
/* 时间奖励值 */ |
|
|
|
.time-reward { |
|
|
|
/* 时间奖励值 */ |
|
|
|
.time-reward { |
|
|
|
position: absolute; |
|
|
|
top: 30rpx; |
|
|
|
right: 32rpx; |
|
|
|
@ -424,38 +451,38 @@ |
|
|
|
border-radius: 30rpx; |
|
|
|
padding: 6rpx 10rpx; |
|
|
|
border: 1rpx solid rgba(255, 255, 255, 0.3); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.reward-icon { |
|
|
|
.reward-icon { |
|
|
|
margin-right: 8rpx; |
|
|
|
font-size: 26rpx; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
color: white; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
/* 筛选标签 */ |
|
|
|
.filter-tabs { |
|
|
|
/* 筛选标签 */ |
|
|
|
.filter-tabs { |
|
|
|
display: flex; |
|
|
|
background-color: #fff; |
|
|
|
padding: 0 32rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.tab-item { |
|
|
|
.tab-item { |
|
|
|
flex: 1; |
|
|
|
text-align: center; |
|
|
|
padding: 32rpx 0; |
|
|
|
font-size: 30rpx; |
|
|
|
color: #666; |
|
|
|
position: relative; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.tab-item.active { |
|
|
|
.tab-item.active { |
|
|
|
color: #77f3f9; |
|
|
|
font-weight: 600; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.tab-item.active::after { |
|
|
|
.tab-item.active::after { |
|
|
|
content: ""; |
|
|
|
position: absolute; |
|
|
|
bottom: 0; |
|
|
|
@ -465,16 +492,16 @@ |
|
|
|
height: 4rpx; |
|
|
|
background-color: #77f3f9; |
|
|
|
border-radius: 2rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
/* 积分记录列表 */ |
|
|
|
.points-list { |
|
|
|
/* 积分记录列表 */ |
|
|
|
.points-list { |
|
|
|
height: calc(100vh - 368rpx); |
|
|
|
padding: 0 30rpx; |
|
|
|
width: 690rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.record-item { |
|
|
|
.record-item { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
justify-content: space-between; |
|
|
|
@ -483,15 +510,15 @@ |
|
|
|
margin-top: 20rpx; |
|
|
|
border-radius: 16rpx; |
|
|
|
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.05); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.record-left { |
|
|
|
.record-left { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
flex: 1; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.record-icon { |
|
|
|
.record-icon { |
|
|
|
width: 80rpx; |
|
|
|
height: 80rpx; |
|
|
|
border-radius: 50%; |
|
|
|
@ -499,172 +526,172 @@ |
|
|
|
align-items: center; |
|
|
|
justify-content: center; |
|
|
|
margin-right: 24rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.record-icon.income { |
|
|
|
.record-icon.income { |
|
|
|
background-color: #e8f5e8; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.record-icon.expense { |
|
|
|
.record-icon.expense { |
|
|
|
background-color: #ffeaea; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.record-icon .iconfont { |
|
|
|
.record-icon .iconfont { |
|
|
|
font-size: 36rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.record-icon.income .iconfont { |
|
|
|
.record-icon.income .iconfont { |
|
|
|
color: #52c41a; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.record-icon.expense .iconfont { |
|
|
|
.record-icon.expense .iconfont { |
|
|
|
color: #ff4d4f; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.record-info { |
|
|
|
.record-info { |
|
|
|
flex: 1; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.record-title { |
|
|
|
.record-title { |
|
|
|
font-size: 32rpx; |
|
|
|
color: #333; |
|
|
|
font-weight: 500; |
|
|
|
margin-bottom: 8rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.record-desc { |
|
|
|
.record-desc { |
|
|
|
font-size: 26rpx; |
|
|
|
color: #999; |
|
|
|
margin-bottom: 8rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.record-time { |
|
|
|
.record-time { |
|
|
|
font-size: 24rpx; |
|
|
|
color: #ccc; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.record-right { |
|
|
|
.record-right { |
|
|
|
text-align: right; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.record-points { |
|
|
|
.record-points { |
|
|
|
font-size: 32rpx; |
|
|
|
font-weight: 600; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.record-points.income { |
|
|
|
.record-points.income { |
|
|
|
color: #52c41a; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.record-points.expense { |
|
|
|
.record-points.expense { |
|
|
|
color: #ff4d4f; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
/* 加载状态 */ |
|
|
|
.load-more, |
|
|
|
.no-more { |
|
|
|
/* 加载状态 */ |
|
|
|
.load-more, |
|
|
|
.no-more { |
|
|
|
text-align: center; |
|
|
|
padding: 40rpx 0; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.load-text, |
|
|
|
.no-more-text { |
|
|
|
.load-text, |
|
|
|
.no-more-text { |
|
|
|
font-size: 28rpx; |
|
|
|
color: #999; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
/* 空状态 */ |
|
|
|
.empty-state { |
|
|
|
/* 空状态 */ |
|
|
|
.empty-state { |
|
|
|
display: flex; |
|
|
|
flex-direction: column; |
|
|
|
align-items: center; |
|
|
|
justify-content: center; |
|
|
|
padding: 120rpx 0; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.empty-icon { |
|
|
|
.empty-icon { |
|
|
|
width: 200rpx; |
|
|
|
height: 200rpx; |
|
|
|
margin-bottom: 32rpx; |
|
|
|
opacity: 0.6; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.empty-text { |
|
|
|
.empty-text { |
|
|
|
font-size: 28rpx; |
|
|
|
color: #999; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
/* 兑换弹窗样式 */ |
|
|
|
.exchange-modal { |
|
|
|
/* 兑换弹窗样式 */ |
|
|
|
.exchange-modal { |
|
|
|
width: 600rpx; |
|
|
|
background: #fff; |
|
|
|
border-radius: 20rpx; |
|
|
|
overflow: hidden; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.modal-header { |
|
|
|
.modal-header { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
justify-content: space-between; |
|
|
|
padding: 40rpx 40rpx 20rpx; |
|
|
|
border-bottom: 1rpx solid #f0f0f0; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.modal-title { |
|
|
|
.modal-title { |
|
|
|
font-size: 36rpx; |
|
|
|
font-weight: 600; |
|
|
|
color: #333; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.close-btn { |
|
|
|
.close-btn { |
|
|
|
width: 60rpx; |
|
|
|
height: 60rpx; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
justify-content: center; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.modal-content { |
|
|
|
.modal-content { |
|
|
|
padding: 40rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.current-reward { |
|
|
|
.current-reward { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
margin-bottom: 40rpx; |
|
|
|
padding: 20rpx; |
|
|
|
background: #f8f9fa; |
|
|
|
border-radius: 12rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.reward-label { |
|
|
|
.reward-label { |
|
|
|
font-size: 28rpx; |
|
|
|
color: #666; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.reward-value { |
|
|
|
.reward-value { |
|
|
|
font-size: 32rpx; |
|
|
|
font-weight: 600; |
|
|
|
color: #77f3f9; |
|
|
|
margin-left: 10rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.exchange-form { |
|
|
|
.exchange-form { |
|
|
|
margin-bottom: 40rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.form-item { |
|
|
|
.form-item { |
|
|
|
margin-bottom: 20rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.form-label { |
|
|
|
.form-label { |
|
|
|
font-size: 28rpx; |
|
|
|
color: #333; |
|
|
|
margin-bottom: 12rpx; |
|
|
|
display: block; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.form-input { |
|
|
|
.form-input { |
|
|
|
width: 100%; |
|
|
|
height: 80rpx; |
|
|
|
border: 1rpx solid #ddd; |
|
|
|
@ -672,55 +699,55 @@ |
|
|
|
padding: 0 20rpx; |
|
|
|
font-size: 28rpx; |
|
|
|
box-sizing: border-box; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.exchange-result { |
|
|
|
.exchange-result { |
|
|
|
padding: 20rpx; |
|
|
|
background: #e8f5e8; |
|
|
|
border-radius: 8rpx; |
|
|
|
margin-top: 20rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.result-text { |
|
|
|
.result-text { |
|
|
|
font-size: 28rpx; |
|
|
|
color: #52c41a; |
|
|
|
font-weight: 500; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.exchange-rules { |
|
|
|
.exchange-rules { |
|
|
|
padding: 20rpx; |
|
|
|
background: #f8f9fa; |
|
|
|
border-radius: 12rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.rules-title { |
|
|
|
.rules-title { |
|
|
|
font-size: 28rpx; |
|
|
|
font-weight: 600; |
|
|
|
color: #333; |
|
|
|
margin-bottom: 16rpx; |
|
|
|
display: block; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.rules-list { |
|
|
|
.rules-list { |
|
|
|
display: flex; |
|
|
|
flex-direction: column; |
|
|
|
gap: 8rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.rule-item { |
|
|
|
.rule-item { |
|
|
|
font-size: 24rpx; |
|
|
|
color: #666; |
|
|
|
line-height: 1.5; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.modal-footer { |
|
|
|
.modal-footer { |
|
|
|
display: flex; |
|
|
|
gap: 20rpx; |
|
|
|
padding: 20rpx 40rpx 40rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.cancel-btn, |
|
|
|
.confirm-btn { |
|
|
|
.cancel-btn, |
|
|
|
.confirm-btn { |
|
|
|
flex: 1; |
|
|
|
height: 80rpx; |
|
|
|
border-radius: 8rpx; |
|
|
|
@ -729,20 +756,20 @@ |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
justify-content: center; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.cancel-btn { |
|
|
|
.cancel-btn { |
|
|
|
background: #f5f5f5; |
|
|
|
color: #666; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.confirm-btn { |
|
|
|
.confirm-btn { |
|
|
|
background: #77f3f9; |
|
|
|
color: #fff; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.confirm-btn:disabled { |
|
|
|
.confirm-btn:disabled { |
|
|
|
background: #ccc; |
|
|
|
color: #999; |
|
|
|
} |
|
|
|
} |
|
|
|
</style> |
1054425342@qq.com
1 month ago