56 lines
1.2 KiB
Vue
56 lines
1.2 KiB
Vue
<template>
|
||
<view class="container">
|
||
<view class="score-title">积分</view>
|
||
<view class="score-content">
|
||
<view class="score-item">
|
||
<text class="score-label">我的积分:</text>
|
||
<text class="score-value">1234</text>
|
||
</view>
|
||
<view class="score-item">
|
||
<text class="score-label">可用积分:</text>
|
||
<text class="score-value">100</text>
|
||
</view>
|
||
<view class="score-item">
|
||
<text class="score-label">积分使用规则:</text>
|
||
</view>
|
||
<!-- 更多积分规则和说明 -->
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
// 数据部分可以根据实际需求添加,比如用户积分、可用积分等
|
||
};
|
||
},
|
||
// 方法部分可以根据需要添加,比如用户积分可用于兑换商品等
|
||
};
|
||
</script>
|
||
|
||
<style scoped>
|
||
.container {
|
||
padding: 20px;
|
||
}
|
||
.score-title {
|
||
font-size: 18px;
|
||
font-weight: bold;
|
||
margin-bottom: 20px;
|
||
}
|
||
.score-item {
|
||
display: flex;
|
||
align-items: center;
|
||
margin-bottom: 10px;
|
||
}
|
||
.score-label {
|
||
flex: 1;
|
||
text-align: right;
|
||
}
|
||
.score-value {
|
||
flex: 1;
|
||
text-align: left;
|
||
font-weight: bold;
|
||
color: #5677fc;
|
||
}
|
||
</style> |