feat(pay): 充值页面增加积分显示

石广澎

2025-11-30 80763662ffaefa7e49cf541201c689f61f5a3caa

 pages/pay/shuaKa/introduce.vue

New file
@@ -0,0 +1,92 @@
<template>
   <view>
      <view class="title">
         <image class="title-icon" src="/static/shuaka/title-icon1.png"></image>
         <view class="title-text">活动累积规则</view>
      </view>
      <view class="content">
         <view class="u-m-t-20">
            1、参与时间：{{$u.timeFormat(info.actStartTime, 'yyyy年mm月dd日')}}到{{$u.timeFormat(info.actEndTime, 'yyyy年mm月dd日')}}，名额{{info.numOfUser}}人。
         </view>
         <view>2、累积刷卡笔数有效时间：用户成功参与活动后{{info.dayMax}}天内。</view>
         <view class="u-m-t-20">3、累积规则：用户使用活动指定银行卡进行支付，单笔支付实际支付金额大于等于{{info.numOfMin/100}}元的交易，方可累积活动刷卡笔数。</view>
         <view class="u-m-t-20">
            4、累积上限：用户参与活动后，每个自然日最多累积{{info.numOfDay}}笔活动刷卡笔数，超过{{info.numOfDay}}笔后，当天继续交易将不会计入活动刷卡笔数。</view>
      </view>
      <view class="title">
         <image class="title-icon" src="/static/shuaka/title-icon2.png"></image>
         <view class="title-text">活动规则</view>
      </view>
      <view class="content">{{info.actRules}}</view>

   </view>
</template>

<script>
   import {
      activityInfo
   } from '@/common/api/shuaka'
   export default {
      data() {
         return {
            info: {
               bankCardName: '',
               totalDiscount: 0,
               dayMax: 0,
               numOfMin: 0,
               numOfDay: 0,
               numOfUser: 0,
               actRules: ''
            },
         };
      },
      onLoad() {
         activityInfo().then(res => {
            if (res) {
               res.actRules = decodeURIComponent(res.actRules || '')
               this.info = res
            }
         })
      }
   }
</script>

<style lang="scss" scoped>
   page {
      box-sizing: border-box;
      background-color: #ffffff;
      padding: 0 32rpx 32rpx;
   }

   .title {
      display: flex;
      justify-content: center;
      margin: 60rpx 0;
   }

   .title-icon {
      width: 42rpx;
      height: 42rpx;
      margin-top: 10rpx;
      margin-right: 10rpx;
   }

   .title-text {
      font-size: 36rpx;
      font-weight: 500;
      padding-bottom: 20rpx;
      color: #333333;
      background-image: url('~@/static/shuaka/title-bg.png');
      background-position: left bottom;
      background-size: 170rpx 14rpx;
      background-repeat: no-repeat;
   }

   .content {
      line-height: 1.5;
      font-size: 30rpx;
      font-weight: 400;
      counter-reset: #333333;
      white-space: pre-wrap;
   }
</style>