|
@@ -1,8 +1,72 @@
|
|
|
<template>
|
|
|
<layout-page>
|
|
|
- <view class="box">
|
|
|
- <SwiperAd :list="swiperAdList"></SwiperAd>
|
|
|
- <view class=""></view>
|
|
|
+ <view class="box defaultBgc">
|
|
|
+ <scroll-view class="scrollBox" scroll-y="true" @scrolltolower="loadingMore">
|
|
|
+ <view class="content">
|
|
|
+ <!-- 钱包 -->
|
|
|
+ <view class="wallet">
|
|
|
+ <view class="wallet-content">
|
|
|
+ <view class="wallet-content-member">
|
|
|
+ <view class="iconBox">
|
|
|
+ <view class="iconBox-line">
|
|
|
+ <uni-icons type="vip-filled" size="40" color="#ffbc00"></uni-icons>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="wallet-content-integral wallet-content-item">
|
|
|
+ <text>{{ balance.point || 0 }}</text>
|
|
|
+ <text>积分</text>
|
|
|
+ </view>
|
|
|
+ <view class="wallet-content-cash wallet-content-item">
|
|
|
+ <text>{{ balance.balance > 0 ? (balance?.balance / 100.0).toFixed(2) : 0 }}</text>
|
|
|
+ <text>余额</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- 签到 -->
|
|
|
+ <view class="signIn">
|
|
|
+ <view class="signIn-content">
|
|
|
+ <view class="signIn-content-items">
|
|
|
+ <view class="item" v-for="(sign, i) in SignItems" :key="sign.day">
|
|
|
+ <view class="box" :class="{ active: i < continuousDay }">
|
|
|
+ <uni-icons type="vip" size="30" color="#ffbc00" style="text-align: center;"></uni-icons>
|
|
|
+ <text class="text">+{{ sign.point }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="day">
|
|
|
+ <text>{{ i === todayNumber ? '今' : '第' + sign.day }}天</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="tips">
|
|
|
+ <button
|
|
|
+ :disabled="todaySignIn"
|
|
|
+ :class="{ disabled: todaySignIn }"
|
|
|
+ @tap="handleSignIn"
|
|
|
+ >
|
|
|
+ {{ todaySignIn ? '已签到' : '签到'}}
|
|
|
+ </button>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- 福利 -->
|
|
|
+ <view class="welfare">
|
|
|
+ <view
|
|
|
+ v-for="item in items"
|
|
|
+ :key="item.id"
|
|
|
+ class="item"
|
|
|
+ >
|
|
|
+ <view class="img">
|
|
|
+ <image
|
|
|
+ src="/static/img/ticket.png"
|
|
|
+ mode="scaleToFill"
|
|
|
+ />
|
|
|
+ </view>
|
|
|
+ <text>{{ item.name }}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <uni-load-more :status="more" />
|
|
|
+ </view>
|
|
|
+ </scroll-view>
|
|
|
</view>
|
|
|
</layout-page>
|
|
|
</template>
|
|
@@ -10,21 +74,292 @@
|
|
|
<script setup>
|
|
|
import { ref } from 'vue'
|
|
|
import layoutPage from '@/layout'
|
|
|
-import SwiperAd from '@/components/SwiperAd'
|
|
|
+import {
|
|
|
+ getRewardSignInConfigList,
|
|
|
+ getRewardSignInRecordSummary,
|
|
|
+ createRewardSignInRecord,
|
|
|
+ getAccountBalance,
|
|
|
+ getUserAccount,
|
|
|
+ getDiyTemplateUsed,
|
|
|
+ getDiyTemplate
|
|
|
+} from '@/api/sign'
|
|
|
+import { onShow, onLoad } from '@dcloudio/uni-app'
|
|
|
+// 设置自定义tabBar选中值
|
|
|
|
|
|
-import { swiperAdListTest } from '@/utils/testData'
|
|
|
-import { onShow } from '@dcloudio/uni-app'
|
|
|
-// 设置自定义tabbar选中值
|
|
|
-onShow(() => {
|
|
|
- const currentPage = getCurrentPages()[0]; // 获取当前页面实例
|
|
|
- const currentTabBar = currentPage?.getTabBar?.();
|
|
|
|
|
|
- // 设置当前tab页的下标index
|
|
|
- currentTabBar?.setData({ selected: 2 });
|
|
|
+const SignItems = ref([])
|
|
|
+
|
|
|
+// 连续签到天数
|
|
|
+const continuousDay = ref(0)
|
|
|
+// 今天有无签到
|
|
|
+const todaySignIn = ref(false)
|
|
|
+
|
|
|
+// 今天
|
|
|
+const todayNumber = ref()
|
|
|
+// 加载
|
|
|
+const signLoading = ref(false)
|
|
|
+
|
|
|
+const balance = ref({})
|
|
|
+
|
|
|
+const items = ref([])
|
|
|
+const more = ref('noMore')
|
|
|
+
|
|
|
+onShow(() => {
|
|
|
+ const currentPage = getCurrentPages()[0]; // 获取当前页面实例
|
|
|
+ const currentTabBar = currentPage?.getTabBar?.();
|
|
|
+ // 设置当前tab页的下标index
|
|
|
+ currentTabBar?.setData({ selected: 2 });
|
|
|
+})
|
|
|
+onLoad(() => {
|
|
|
+ // 获取签到列表
|
|
|
+ getSignIn()
|
|
|
+ // 获取签到信息
|
|
|
+ getSummary()
|
|
|
+ // 获取余额积分
|
|
|
+ getBalance()
|
|
|
+ // 获取模板
|
|
|
+ handleGetTmpUsed()
|
|
|
})
|
|
|
-const swiperAdList = ref(swiperAdListTest)
|
|
|
+
|
|
|
+// 获取积分余额
|
|
|
+async function getBalance() {
|
|
|
+ const { data } = await getAccountBalance()
|
|
|
+ const { data: _data } = await getUserAccount()
|
|
|
+ balance.value = {
|
|
|
+ ...data,
|
|
|
+ point: _data.point
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+// 获取个人签到统计
|
|
|
+async function getSummary() {
|
|
|
+ const { data } = await getRewardSignInRecordSummary()
|
|
|
+ if (!data) return
|
|
|
+ continuousDay.value = data.continuousDay // 连续签到第n天
|
|
|
+ todaySignIn.value = data.todaySignIn // 今天有无签到
|
|
|
+ todayNumber.value = todaySignIn.value ? continuousDay.value - 1 : continuousDay.value
|
|
|
+}
|
|
|
+// 获取签到列表
|
|
|
+async function getSignIn () {
|
|
|
+ try {
|
|
|
+ const { data } = await getRewardSignInConfigList()
|
|
|
+ SignItems.value = data
|
|
|
+ } catch (error) {
|
|
|
+
|
|
|
+ }
|
|
|
+}
|
|
|
+// 签到
|
|
|
+async function handleSignIn () {
|
|
|
+ if (signLoading.value) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ try {
|
|
|
+ signLoading.value = true
|
|
|
+ await createRewardSignInRecord()
|
|
|
+ setTimeout(async () => {
|
|
|
+ await getSummary()
|
|
|
+
|
|
|
+ uni.showToast({
|
|
|
+ title: '签到成功',
|
|
|
+ icon: 'success',
|
|
|
+ mask: true
|
|
|
+ })
|
|
|
+ // 更新积分
|
|
|
+ getBalance()
|
|
|
+ }, 1000)
|
|
|
+ } catch (error) {
|
|
|
+
|
|
|
+ } finally {
|
|
|
+ signLoading.value = false
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+async function handleGetTmpUsed () {
|
|
|
+ try {
|
|
|
+ const { data } = await getDiyTemplateUsed()
|
|
|
+ if (!data?.home?.components) {
|
|
|
+ uni.showToast({
|
|
|
+ title: '暂无优惠券',
|
|
|
+ icon: 'none',
|
|
|
+ mask: true
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
+ const idsItem = data.home.components.find(e => e.id === 'CouponCard')
|
|
|
+ if (!idsItem) {
|
|
|
+ uni.showToast({
|
|
|
+ title: '暂无优惠券',
|
|
|
+ icon: 'none',
|
|
|
+ mask: true
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
+ const ids = idsItem?.property?.couponIds
|
|
|
+ if (!ids) {
|
|
|
+ uni.showToast({
|
|
|
+ title: '暂无优惠券',
|
|
|
+ icon: 'none',
|
|
|
+ mask: true
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
+ const { data: _data } = await getDiyTemplate(ids.join(','))
|
|
|
+ items.value.push(..._data)
|
|
|
+ more.value = 'noMore'
|
|
|
+ } catch (error) {
|
|
|
+
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+async function loadingMore () {}
|
|
|
+
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
-
|
|
|
+$px: 20rpx;
|
|
|
+.box {
|
|
|
+ overflow: hidden;
|
|
|
+ height: 100vh;
|
|
|
+ padding: $px 0 0 0;
|
|
|
+ box-sizing: border-box;
|
|
|
+ .scrollBox{
|
|
|
+ height: 100%;
|
|
|
+
|
|
|
+ padding-bottom: 120rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ }
|
|
|
+ .content {
|
|
|
+ padding-bottom: 24rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ }
|
|
|
+ .wallet {
|
|
|
+ // padding: 0 $px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ height: 200rpx;
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+ &-content {
|
|
|
+ display: flex;
|
|
|
+ height: 100%;
|
|
|
+ // border: 2rpx solid #E5E5E5;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ background: #FFF;
|
|
|
+
|
|
|
+ &-member {
|
|
|
+ width: 50%;
|
|
|
+ .iconBox {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ &-line {
|
|
|
+ border: 10rpx solid #ffbc00;
|
|
|
+ border-radius: 180rpx;
|
|
|
+ padding: 10rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ &-item {
|
|
|
+ width: 25%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ }
|
|
|
+ &-integral {
|
|
|
+ }
|
|
|
+ &-cash {
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .signIn {
|
|
|
+ // padding: 0 $px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ &-content {
|
|
|
+ border-radius: 10rpx;
|
|
|
+ background: #FFF;
|
|
|
+ &-items {
|
|
|
+ padding: 20rpx $px;
|
|
|
+ display: flex;
|
|
|
+ height: 220rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ .item {
|
|
|
+ height: 140rpx;
|
|
|
+ width: 100%;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ padding: 0 10rpx;
|
|
|
+ .box {
|
|
|
+ height: 100%;
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ background: #f2f4f7;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ &.active {
|
|
|
+ background: rgba(16,137,123, .66);
|
|
|
+ }
|
|
|
+ .text {
|
|
|
+ font-size: .75em;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .day {
|
|
|
+ margin-top: 10rpx;
|
|
|
+ height: 60rpx;
|
|
|
+ text-align: center;
|
|
|
+ font-size: .5em;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .tips {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: flex-end;
|
|
|
+ height: 80rpx;
|
|
|
+ font-size: .75em;
|
|
|
+ color: #999;
|
|
|
+ &-light {
|
|
|
+ color: #00897B;
|
|
|
+ padding: 0 10rpx;
|
|
|
+ }
|
|
|
+ button {
|
|
|
+ width: 180rpx;
|
|
|
+ height: 60rpx;
|
|
|
+ font-size: 24rpx;
|
|
|
+ margin: 0 10rpx;
|
|
|
+ border: unset;
|
|
|
+ background-color: #00897B;
|
|
|
+ color: #FFF;
|
|
|
+ &.disabled {
|
|
|
+ background-color: #a7a7a7 !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .welfare {
|
|
|
+ display: grid;
|
|
|
+ grid-template-columns: repeat(2, 1fr);
|
|
|
+ grid-gap: 20rpx;
|
|
|
+ padding: 20rpx $px;
|
|
|
+ .item {
|
|
|
+ text-align: center;
|
|
|
+ background: #FFF;
|
|
|
+ padding: $px;
|
|
|
+ font-size: .85em;
|
|
|
+ .img {
|
|
|
+ image {
|
|
|
+ width: 128rpx;
|
|
|
+ height: 128rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|