<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>