1.站点权益充值

2.站点收藏
3.充值防抖

src/api/user.ts

@@ -175,6 +175,16 @@ export function listAvailableCoupons(stationId: any) {
 }
 
 
+/**
+ * 获取站点可以领取的权益
+ * @param stationId
+ */
+export function listAvailableRights(stationId: any) {
+  return userHttp.get(`/rechargeRights/listAvailableRechargeRights?stationId=${stationId}`, {
+  });
+}
+
+
 /**
  * 领取优惠券
  * @param couponId

src/components/charge-station/charge-station.vue

@@ -93,10 +93,8 @@
       </view>
       <view
           class="btn flex-shrink flex-column flex-center"
-          @touchstart="touchstart"
-          @touchend.stop="touchend"
-          data-method="collect"
-      >
+          @tap.stop="collect" >
+
         <uni-icons
             :type="collected ? 'star-filled' : 'star'"
             size="20"

src/components/station-coupon/station-coupon.vue

@@ -2,10 +2,76 @@
   <style-dialog
       v-if="visible"
       @close="handleClose"
-      title="站点优惠券领取">
+      title="优惠领取">
 
     <view class="page pt-20 pr-40 pl-40">
-      <view>
+      <view class="tab-list flex-align-end">
+        <view class="fs-28 color-666 mt-20 w50" :class="mode===0?'active':''" @click="changeTab(0)">权益卡</view>
+        <view class="fs-28 color-666 mt-20 w50" :class="mode===1?'active':''" @click="changeTab(1)">优惠券</view>
+      </view>
+
+      <view v-if="mode===0">
+        <view
+            class="item mt-20 "
+            v-for="(item, index) in rightsList"
+            :key="index">
+
+          <image class="full-percent" src="/pages-charge/static/discount-bg.png"></image>
+          <view class="absolute-full flex pt-8 pb-8">
+            <view class="left  flex-justify-center pl-48">
+
+              <view class="item-content_left">
+                <view class="flex-align-end">
+                  <view class="item-header__left">
+                    <image class="width-84" src="/static/images/discount-rights-card.png" mode="widthFix"></image>
+                    <view class="fs-48 lh-58 color-000 fw-500 ml-16">
+                      {{ (item.discount / 10).toFixed(1) }}折
+                    </view>
+                    <view class="fs-26 color-999 ml-16" v-if="mode === 0"
+                    >抵扣充电服务费
+                    </view>
+                  </view>
+                </view>
+
+
+                <block>
+                  <view class="fs-26 color-999 mt-8"
+                        @click.stop="to(`/pages-common/activity/activity?id=${item.activityId}`)">
+                    <view class="fs-26 color-999">到期时间：{{ item.endTime }}</view>
+                    <view class="flex-align-center" v-if="mode === 0">
+                      <view class="fs-24 color-999">充值{{ ((item.amountMin || 0) / 100).toFixed(2) }}元，享受{{ (item.discount / 10).toFixed(1) }}折服务费权益，有效期{{item.validity}}天
+<!--                        <text class="color-primary">详细规则</text>
+                        <text class="fs-24 ml-4 color-primary">>></text>-->
+                      </view>
+                    </view>
+                  </view>
+                </block>
+              </view>
+              <view class="item-content_right">
+                <text class="item-content_right-charge item-status ml-10" @tap.stop="handleCharge(item)">去充值</text>
+              </view>
+
+            </view>
+          </view>
+        </view>
+
+
+        <view style="width: 100%;text-align: center;display: flex;flex-direction: column;align-content: center;align-items: center;">
+          <image v-if="!rightsList||rightsList.length==0"
+                 style="width: 240rpx;" mode="widthFix"
+                 src="/static/images/search-empty.png"></image>
+
+<!--          <text style="font-size: 22rpx;">暂无权益</text>-->
+        </view>
+
+
+<!--        <view style="width: 100%;text-align: center;">
+          <image v-if="!rightsList||rightsList.length==0" style="width: 240rpx;" mode="widthFix" src="/static/images/search-empty.png"></image>
+        </view>-->
+
+      </view>
+
+      <view v-if="mode===1">
         <view
             class="item mt-20 "
             v-for="(item, index) in couponList"
@@ -64,7 +130,7 @@
                  style="width: 240rpx;" mode="widthFix"
                  src="/static/images/search-empty.png"></image>
 
-          <text style="font-size: 22rpx;">暂无优惠券</text>
+<!--          <text style="font-size: 22rpx;">暂无优惠券</text>-->
         </view>
       </view>
 
@@ -78,11 +144,11 @@
 <script setup lang="ts">
 import {onPullDownRefresh} from "@dcloudio/uni-app";
 import {ref} from "vue";
-import {collectCoupon, listAvailableCoupons} from "@/api/user";
+import {collectCoupon, listAvailableCoupons, listAvailableRights} from "@/api/user";
 import {to} from "@/utils/navigate";
 
 const mode = ref(0);
-const list = ref<any[]>([]);
+const rightsList = ref<any[]>([]);
 const couponList = ref<any[]>([]);
 const stationId = ref(null);
 const visible = ref(false);
@@ -99,6 +165,10 @@ const changeTab = (tab: number) => {
   mode.value = tab;
 }
 
+const handleCharge = (rights:any) => {
+  to(`/pages-user/wallet-recharge/wallet-recharge?discount=${rights.amountMin}`)
+}
+
 const handleCollectCoupon = (coupon: any, index: number) => {
   if (coupon.collected) return;
   collectCoupon(coupon.id).then((res) => {
@@ -124,11 +194,17 @@ const loadData = () => {
   uni.showLoading({
     title: "加载中",
   });
-  listAvailableCoupons(stationId.value).then((res) => {
+  Promise.all([listAvailableCoupons(stationId.value), listAvailableRights(stationId.value)]).then((values) => {
+    console.log(values)
+    uni.hideLoading();
+    couponList.value = values[0].list||[];
+    rightsList.value = values[1].list||[];
+  })
+ /* listAvailableCoupons(stationId.value).then((res) => {
     console.log(res)
     uni.hideLoading();
     couponList.value = res.list;
-  });
+  });*/
 }
 const open = (sid: any) => {
   visible.value = true;

src/pages-user/wallet-recharge/wallet-recharge.vue

@@ -4,30 +4,32 @@
       <view class="title pt-30 pb-30">充值金额</view>
       <view class="flex-wrap">
         <view
-          :class="[
+            :class="[
             'option',
             'flex-center',
             `option-${index === payOption && !payValue ? 'active' : ''}`,
           ]"
-          v-for="(item, index) in payOptions"
-          :key="index"
-          @click="changeOption(index)"
+            v-for="(item, index) in payOptions"
+            :key="index"
+            @click="changeOption(index)"
         >
           <view
-            class="tag fs-24 color-fff fw-500"
-            v-if="payOptionsDiscount[index]"
-            >{{ payOptionsDiscount[index] }}</view
+              class="tag fs-24 color-fff fw-500"
+              v-if="payOptionsDiscount[index]"
+          >{{ payOptionsDiscount[index] }}
+          </view
           >
           {{ item }}
         </view>
       </view>
       <view v-if="payOptionsDiscountDay[payOption]" class="flex-align-center">
         <view class="fs-30 color-666"
-          >折扣优惠有效期{{ payOptionsDiscountDay[payOption] }}天</view
+        >折扣优惠有效期{{ payOptionsDiscountDay[payOption] }}天
+        </view
         >
         <view
-          class="ml-12 color-primary fs-30"
-          @click="to(`/pages-common/activity/activity?id=${activityId}`)"
+            class="ml-12 color-primary fs-30"
+            @click="to(`/pages-common/activity/activity?id=${activityId}`)"
         >
           <text>详细规则</text>
           <text class="fs-24 ml-6">>></text>
@@ -35,28 +37,31 @@
       </view>
       <view class="title pt-60 pb-30">自定义金额</view>
       <style-input
-        :value="payValue > 0 ? payValue : ''"
-        title="金额"
-        type="digit"
-        @input="input"
+          :value="payValue > 0 ? payValue : ''"
+          title="金额"
+          type="digit"
+          @input="input"
       />
     </view>
   </view>
 
   <style-bottom-view>
     <view class="pl-60 pr-60 pb-20">
-      <style-button size="small" type="primary" @click="confirm"
-        >充值</style-button
+      <style-button size="small" type="primary" @click="debounceConfirm"
+      >充值
+      </style-button
       >
     </view>
   </style-bottom-view>
 </template>
 
 <script setup lang="ts">
-import { ref } from "vue";
-import { fetchProfile, insertMoney } from "../../api/user";
-import { onLoad } from "@dcloudio/uni-app";
-import { to, back } from "@/utils/navigate";
+import {ref} from "vue";
+import {fetchProfile, insertMoney} from "../../api/user";
+import {onLoad} from "@dcloudio/uni-app";
+import {back, to} from "@/utils/navigate";
+import {debounce} from "@/utils/util";
+
 const balance = ref(0);
 const payOption = ref(3);
 const payOptions = ref([30, 50, 100, 200, 500, 1000]);
@@ -72,6 +77,11 @@ const changeOption = (index: number) => {
   payValue.value = 0;
   payOption.value = index;
 };
+
+const debounceConfirm = debounce(()=>{
+  confirm();
+},500)
+
 const confirm = () => {
   if (payValue.value && !/^[0-9]*(\.\d{1,2})?$/.test(`${payValue.value}`)) {
     uni.showModal({
@@ -83,8 +93,8 @@ const confirm = () => {
     return;
   }
   const params = payValue.value
-    ? Number(payValue.value)
-    : payOptions.value[payOption.value];
+      ? Number(payValue.value)
+      : payOptions.value[payOption.value];
   if (params > 10000 || params <= 0) {
     uni.showModal({
       title: "温馨提示",
@@ -98,41 +108,48 @@ const confirm = () => {
     title: "加载中",
   });
   insertMoney(params)
-    .then(() => {
-      return fetchProfile();
-    })
-    .then((res) => {
-      payValue.value = 0;
-      balance.value = res.balance;
-      uni.hideLoading();
-      uni.showToast({
-        title: "已支付",
-        icon: "success",
-      });
-      setTimeout(() => {
-        if (needBack.value) {
-          back();
-        } else {
-          to("/pages-user/wallet/wallet");
+      .then(() => {
+        return fetchProfile();
+      })
+      .then((res) => {
+        payValue.value = 0;
+        balance.value = res.balance;
+        uni.hideLoading();
+        uni.showToast({
+          title: "已支付",
+          icon: "success",
+        });
+        setTimeout(() => {
+          if (needBack.value) {
+            back();
+          } else {
+            to("/pages-user/wallet/wallet");
+          }
+        }, 2000);
+      })
+      .catch((err) => {
+        if (/cancel/.test(err.errMsg)) {
+          return;
         }
-      }, 2000);
-    })
-    .catch((err) => {
-      if (/cancel/.test(err.errMsg)) {
-        return;
-      }
-      uni.showModal({
-        content: `${err.errMsg},请重试`,
+        uni.showModal({
+          content: `${err.errMsg},请重试`,
+        });
       });
-    });
 };
+
+
 onLoad((options: any) => {
+  console.log(options)
   if (options.value) {
     payOption.value = payOptions.value.findIndex(
-      (item) => item === Number((Number(options.value) / 100).toFixed(2))
+        (item) => item === Number((Number(options.value) / 100).toFixed(2))
     );
     needBack.value = !!options.back;
   }
+
+  if(options.discount){
+    payValue.value = Number((Number(options.discount) / 100).toFixed(2));
+  }
   fetchProfile().then((res) => {
     // console.log(res);
     balance.value = res.balance;
@@ -143,7 +160,7 @@ onLoad((options: any) => {
         if (fi >= 0) {
           payOptionsDiscount.value[fi] = item.rightsDesc;
           payOptionsDiscountDay.value[fi] =
-            item.validity > 0 ? item.validity : 1;
+              item.validity > 0 ? item.validity : 1;
         }
       });
       activityId.value = res.activityList[0].id;
@@ -172,9 +189,11 @@ onLoad((options: any) => {
     color: #000;
     font-weight: 500;
     overflow: hidden;
+
     &:nth-child(3n + 1) {
       margin-left: 0;
     }
+
     .tag {
       position: absolute;
       top: 0px;
@@ -186,6 +205,7 @@ onLoad((options: any) => {
       white-space: nowrap;
     }
   }
+
   .option-active {
     background-color: var(--color-primary);
     color: #fff;

src/utils/util.ts

@@ -0,0 +1,35 @@
+// -防抖
+export function debounce(fn, wait) {
+    let delay = wait || 500
+    let timer
+    return function() {
+        let args = arguments;
+        if (timer) {
+            clearTimeout(timer)
+            console.log('debounce')
+        }
+        let callNow = !timer
+        timer = setTimeout(() => {
+            console.log('debounce send')
+            timer = null
+        }, delay)
+        if (callNow) fn.apply(this, args)
+    }
+}
+
+// -节流
+export function throttle(fn, wait) {
+    let delay = wait || 500
+    let timer = null
+    return function() {
+        if (timer) {
+            console.log('throttle');
+            return
+        }
+        timer = setTimeout(() => {
+            console.log('throttle send');
+            fn.apply(this, arguments)
+            timer = null
+        }, delay)
+    }
+}