mirror of
https://gitee.com/niucloud-team/niucloud.git
synced 2026-04-09 06:20:04 +00:00
549 lines
29 KiB
Vue
549 lines
29 KiB
Vue
<template>
|
|
<view :style="themeColor()">
|
|
<view class="min-h-screen overflow-hidden" v-if="Object.values(info).length" :class="{ 'is-use' : info && info.is_use }">
|
|
<view v-if="info.is_use">
|
|
<view class="sigin-header">
|
|
<!-- #ifndef H5 -->
|
|
<view v-if="info.rule_explain" class="side-tab" :style="{top: topStyle}" @click="signPopup = true">
|
|
<text class="nc-iconfont nc-icon-a-meiriqiandaoV6xx-36 icon"></text>
|
|
<text class="desc">签到规则</text>
|
|
</view>
|
|
<view :style="{height: headStyle, backgroundImage: 'url(' + img('static/resource/images/app/sigin_uniapp.png') + ')',backgroundSize: '100% 100%', backgroundRepeat: 'no-repeat'}">
|
|
<top-tabbar :data="topTabbarData" :scrollBool="topTabarObj.getScrollBool()" class="top-header" />
|
|
</view>
|
|
<!-- #endif -->
|
|
<!-- #ifdef H5 -->
|
|
<view v-if="info.rule_explain" class="side-tab" @click="signPopup = true">
|
|
<text class="nc-iconfont nc-icon-a-meiriqiandaoV6xx-36 icon"></text>
|
|
<text class="desc">签到规则</text>
|
|
</view>
|
|
<view class="h-[382rpx]" :style="{ backgroundImage: 'url(' + img('static/resource/images/app/sigin_h5.png') + ')',backgroundSize: '100%', backgroundRepeat: 'no-repeat'}"></view>
|
|
<!-- #endif -->
|
|
</view>
|
|
<view>
|
|
<view class="sidebar-margin bg-[#fff] rounded-[16rpx] -mt-[85rpx]">
|
|
<view class="card-template">
|
|
<view class="mb-[30rpx] flex justify-between items-center" v-if="flag">
|
|
<view class="flex items-center">
|
|
<text class="iconfont iconshangyibu text-[#303133] text-[20rpx]" @click="changeMonth('prev')"></text>
|
|
<view class="mx-[24rpx] text-[30rpx] font-500 text-[#303133] leading-[45rpx]">{{ state.curYear }}年{{ state.curMonth + 1 }}月</view>
|
|
<text class="iconfont iconxiayibu1 text-[#303133] text-[20rpx]" @click="changeMonth('next')"></text>
|
|
</view>
|
|
<view class="flex items-center">
|
|
<text class="nc-iconfont nc-icon-shangV6xx-1 text-[var(--text-color-light9)] pt-[4rpx] px-[6rpx] text-[24rpx]" @click="handleChange"></text>
|
|
</view>
|
|
</view>
|
|
<view class="mb-[30rpx] flex justify-between items-center" v-else>
|
|
<view class="font-500 text-[30rpx]">已连续签到<text class="text-[#EF000C] mx-[4rpx]">{{ info.days }}</text>天</view>
|
|
<text class="nc-iconfont nc-icon-xiaV6xx pt-[4rpx] px-[6rpx] text-[var(--text-color-light9)] text-[24rpx]" v-if="!flag" @click="flag = !flag"></text>
|
|
</view>
|
|
<view class="relative z-9 bg-[#fff] rounded-[18rpx]">
|
|
<view>
|
|
<view class="flex items-center justify-between text-[var(--text-color-light9)] text-[24rpx] mb-[16rpx]">
|
|
<text class="w-[14.28%] leading-[36rpx] text-center">周一</text>
|
|
<text class="w-[14.28%] leading-[36rpx] text-center">周二</text>
|
|
<text class="w-[14.28%] leading-[36rpx] text-center">周三</text>
|
|
<text class="w-[14.28%] leading-[36rpx] text-center">周四</text>
|
|
<text class="w-[14.28%] leading-[36rpx] text-center">周五</text>
|
|
<text class="w-[14.28%] leading-[36rpx] text-center">周六</text>
|
|
<text class="w-[14.28%] leading-[36rpx] text-center">周日</text>
|
|
</view>
|
|
<view class="flex flex-wrap items-center justify-start" v-if="!flag">
|
|
<template v-for="(item,index) in state.weekCount" :key="index">
|
|
<view class="w-[14.28%] flex flex-col justify-center items-center">
|
|
<view v-if="filteredDate(item)" class="filtered-date-wrap"
|
|
:class="{'sign-bg': isVerDate(item),'week-normal': !isVerDate(item) && item < state.curDate && (state.curMonth + 1) == (new Date().getMonth() + 1) ,'mb20':isCurrentDate(item),'mb30':!isCurrentDate(item)}"
|
|
@click="getDayPackFn(item)">
|
|
<text class="text-[24rpx] leading-[28rpx] mb-[6rpx]">{{ filteredDate(item) }}</text>
|
|
<view v-if="filteredDate(item)" class="flex items-center justufy-center">
|
|
<image v-if="isPackDate(item)" :src="img('static/resource/images/app/package.png')" class="w-[40rpx] h-[40rpx]"/>
|
|
<image v-else-if="isVerDate(item)" :src="img('static/resource/images/app/hassigin.png')" class="w-[34rpx] h-[34rpx]"/>
|
|
<template v-else>
|
|
<image v-if="!isVerDate(item) && item < state.curDate && (state.curMonth + 1) == (new Date().getMonth() + 1)"
|
|
:src="img('static/resource/images/app/nosigin.png')" class="w-[34rpx] h-[34rpx]"/>
|
|
<image v-else :src="img('static/resource/images/app/nosigin1.png')"
|
|
class="w-[34rpx] h-[34rpx]"/>
|
|
</template>
|
|
</view>
|
|
</view>
|
|
<view class="w-[10rpx] h-[10rpx] rounded-[50%] bg-[var(--primary-color)]" v-if="isCurrentDate(item)"></view>
|
|
</view>
|
|
</template>
|
|
</view>
|
|
<view class="flex flex-wrap items-center justify-start" v-else>
|
|
<template v-for="(item,index) in state.dataCount">
|
|
<view class="w-[14.28%] flex flex-col justify-center items-center mb-[30rpx]">
|
|
<view v-if="filteredDate(item)"
|
|
class="filtered-date-wrap"
|
|
:class="{'sign-bg': isVerDate(item) && active ,'day-normal': !isVerDate(item) && item < state.curDate && (state.curMonth + 1) == (new Date().getMonth() + 1) && state.curYear == new Date().getFullYear() ,'mb20':isCurrentDate(item),'mb30':!isCurrentDate(item)}"
|
|
@click="getDayPackFn(item)">
|
|
<text class="text-[24rpx] leading-[28rpx] mb-[6rpx]">{{ filteredDate(item) }}</text>
|
|
<view v-if="filteredDate(item)" class="flex items-center justufy-center">
|
|
<image v-if="isPackDate(item)" :src="img('static/resource/images/app/package.png')" class="w-[40rpx] h-[40rpx]" />
|
|
<image v-else-if="isVerDate(item) && active " :src="img('static/resource/images/app/hassigin.png')" class="w-[34rpx] h-[34rpx]"/>
|
|
<template v-else>
|
|
<image v-if="!isVerDate(item) && item < state.curDate && (state.curMonth + 1) == (new Date().getMonth() + 1)"
|
|
:src="img('static/resource/images/app/nosigin.png')" class="w-[34rpx] h-[34rpx]"/>
|
|
<image v-else :src="img('static/resource/images/app/nosigin1.png')" class="w-[34rpx] h-[34rpx]"/>
|
|
</template>
|
|
</view>
|
|
</view>
|
|
<view class="w-[10rpx] h-[10rpx] rounded-[50%] bg-[var(--primary-color)]" v-if="isCurrentDate(item)"></view>
|
|
</view>
|
|
</template>
|
|
</view>
|
|
<view class="mt-[40rpx] flex justify-center" v-if="state.curMonth + 1 == (new Date().getMonth() + 1) && state.curYear == new Date().getFullYear() ">
|
|
<button v-if="!info.is_sign"
|
|
class="rounded-[40rpx] flex-center !bg-transparent text-[26rpx] font-500"
|
|
:style="{width:'490rpx',height:'80rpx',border:'none', color:'#fff',backgroundImage: `url(${img('static/resource/images/app/button_bg2.png')})`,backgroundSize: '100%', backgroundRepeat: 'no-repeat'}"
|
|
shape="circle" @click="setSignFn">
|
|
<text class="nc-iconfont nc-icon-a-meiriqiandaoV6xx-36 text-[26rpx] text-[#fff] mr-[8rpx]"></text>
|
|
<text>立即签到</text>
|
|
</button>
|
|
<button v-else class="rounded-[40rpx] flex-center !bg-transparent text-[26rpx] font-500"
|
|
:style="{width:'490rpx',height:'80rpx',border:'none',color:'#fff', backgroundImage: `url(${img('static/resource/images/app/button_bg1.png')})`,backgroundSize: '100%', backgroundRepeat: 'no-repeat'}"
|
|
shape="circle">
|
|
<text class="nc-iconfont nc-icon-a-meiriqiandaoV6xx-36 text-[26rpx] text-[#fff] mr-[8rpx]"></text>
|
|
<text>已签到</text>
|
|
</button>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="mt-[20rpx] mb-[30rpx] sidebar-margin card-template" v-if="info && info.continue_award && Object.keys(info.continue_award).length">
|
|
<view class="mb-[30rpx] flex items-center">
|
|
<view class="font-500 text-[30rpx] text-[#303133]">签到奖励</view>
|
|
<!-- <view class="text-[var(--text-color-light6)] text-[26rpx] leading-[30rpx]">
|
|
<text>签到记录</text>
|
|
<image :src="img('static/resource/images/app/more.png')" class="w-[12rpx] h-[18rpx] ml-[8rpx]" />
|
|
</view> -->
|
|
</view>
|
|
<view>
|
|
<view v-for="(item,index) in info.continue_award" :key="index" class="flex items-center border-box" :class="{'mt40':index}">
|
|
<view class="w-[90rpx] h-[90rpx] rounded-[50%] bg-[#E7F6FF] flex items-center justify-center flex-shrink-0" v-if="(index + 1) % 4 == 1">
|
|
<image :src="img('static/resource/images/app/icon_02.png')" class="w-[40rpx] h-[40rpx]"/>
|
|
</view>
|
|
<view class="w-[90rpx] h-[90rpx] rounded-[50%] bg-[#ffefef] flex items-center justify-center flex-shrink-0" v-else-if="(index + 1) % 4 == 2">
|
|
<image :src="img('static/resource/images/app/icon_03.png')" class="w-[40rpx] h-[40rpx]"/>
|
|
</view>
|
|
<view class="w-[90rpx] h-[90rpx] rounded-[50%] bg-[#d3feeb] flex items-center justify-center flex-shrink-0" v-else-if="(index + 1) % 4 == 3">
|
|
<image :src="img('static/resource/images/app/icon_04.png')" class="w-[40rpx] h-[40rpx]"/>
|
|
</view>
|
|
<view class="w-[90rpx] h-[90rpx] rounded-[50%] bg-[#ffeddd] flex items-center justify-center flex-shrink-0" v-else-if="(index + 1) % 4 == 0">
|
|
<image :src="img('static/resource/images/app/icon_05.png')" class="w-[40rpx] h-[40rpx]"/>
|
|
</view>
|
|
<view class="flex-1 mx-[20rpx]">
|
|
<view class="font-400 text-[28rpx] text-[#303133] leading-[38rpx] mb-[10rpx]">连续签到{{ item.continue_sign }}天</view>
|
|
<view class="flex flex-wrap" v-if="item.gift && item.gift.total">
|
|
<view class="flex">
|
|
<image :src="img(item.gift.total.icon)" class="w-[30rpx] h-[30rpx] flex-shrink-0"/>
|
|
<view class="text-[24rpx] ml-[8rpx] text-[#FF9000] leading-[34rpx] max-w-[330rpx]">{{ item.gift.total.text }}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="flex-shrink-0">
|
|
<view v-if="Number(info.days) < Number(item.continue_sign) " class="w-[130rpx] h-[54rpx] text-center bg-primary-light rounded-[28rpx] text-[22rpx] text-[var(--primary-color)] flex-center font-500">待完成</view>
|
|
<view v-else class="primary-btn-bg w-[130rpx] h-[54rpx] text-center rounded-[27rpx] text-[22rpx] text-[#fff] flex-center font-500">已完成</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="h-[100vh] w-[100vw] flex justify-center items-center" v-else>
|
|
<!-- #ifdef MP-WEIXIN || APP-PLUS -->
|
|
<top-tabbar :data="topTabbarData" :scrollBool="topTabarObj.getScrollBool()" class="top-header" />
|
|
<!-- #endif -->
|
|
<u-empty text="签到未开启" width="347rpx" height="265rpx" :icon="img('static/resource/images/system/empty.png')" />
|
|
</view>
|
|
<!-- 签到规则-->
|
|
<u-popup :show="signPopup" :round="16" mode="bottom" @close="signPopup = false">
|
|
<view class="popup-common">
|
|
<view class="title">签到规则</view>
|
|
<scroll-view :scroll-y="true" class="px-[30rpx] box-border h-[360rpx] overflow-auto">
|
|
<template v-for="(item) in info.rule_explain.split('\n')">
|
|
<view class="text-[28rpx] leading-[40rpx] mb-[20rpx]">{{ item }}</view>
|
|
</template>
|
|
</scroll-view>
|
|
<view class="btn-wrap">
|
|
<button class="primary-btn-bg btn" @click="signPopup = false">知道了</button>
|
|
</view>
|
|
</view>
|
|
</u-popup>
|
|
<!-- 签到奖励 -->
|
|
<u-popup :show="awardShow" class="award-popup overflow-hidden"
|
|
:customStyle="{backgroundColor:'transparent'}" @close="awardShow = false" mode="center"
|
|
round="var(--rounded-big)" :safeAreaInsetBottom="false">
|
|
<view class="w-[550rpx] -mt-[124rpx]" v-if="Object.values(signAward).length">
|
|
<view class="flex justify-center">
|
|
<image :src="img('static/resource/images/app/award.png')" class="w-[484rpx] h-[480rpx] z-10" mode="aspectFill"/>
|
|
</view>
|
|
<view class="-mt-[265rpx] bg-award rounded-[40rpx] pt-[100rpx] pb-[50rpx] mb-[50rpx] relative">
|
|
<view class="px-[32rpx]">
|
|
<view class="text-[36rpx] text-[#EF000C] font-500 mb-[10rpx] text-center">{{ signAward.title }}</view>
|
|
<view class="text-[24rpx] text-[#333] leading-[34rpx] text-center mb-[60rpx]" v-if="signAward.info">{{ signAward.info }}</view>
|
|
<view class="px-[68rpx] mb-[100rpx]">
|
|
<template v-for="(item,index) in signAward.awards">
|
|
<template v-if="item.content" v-for="(subItem,subIndex) in item.content">
|
|
<view class="flex items-center mb-[30rpx]">
|
|
<image :src="img(subItem.icon)" class="w-[42rpx] h-[42rpx]" />
|
|
<view class="ml-[20rpx] text-[28rpx] text-[#303133] leading-[38rpx]">{{ subItem.text }}</view>
|
|
</view>
|
|
</template>
|
|
</template>
|
|
</view>
|
|
<view class="flex justify-center relative z-30">
|
|
<view class="w-[370rpx] h-[80rpx] primary-btn-bg font-500 rounded-[100rpx] text-[#ffffff] text-center leading-[80rpx] text-[26rpx]" @click="awardShow = false">我知道了</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="flex justify-center">
|
|
<text class="nc-iconfont nc-icon-cuohaoV6xx1 text-[#fff] text-[50rpx]" @click="awardShow = false"></text>
|
|
</view>
|
|
</view>
|
|
</u-popup>
|
|
<!-- 查看当日或连续签到奖励 -->
|
|
<u-popup :show="packShow" class="award-popup overflow-hidden" :customStyle="{backgroundColor:'transparent'}" @close="packShow = false" mode="center" round="var(--rounded-big)" :safeAreaInsetBottom="false">
|
|
<view class="w-[550rpx] -mt-[124rpx]" v-if="Object.values(packInfo).length">
|
|
<view class="flex justify-center">
|
|
<image :src="img('static/resource/images/app/award.png')" class="w-[484rpx] h-[480rpx] z-10" mode="aspectFill"/>
|
|
</view>
|
|
<view class="-mt-[265rpx] bg-award rounded-[40rpx] pt-[100rpx] pb-[50rpx] mb-[50rpx] relative">
|
|
<view class="px-[32rpx]">
|
|
<view class="text-[36rpx] text-[#303133] font-500 mb-[10rpx] text-center relative z-20">{{ packInfo.title }}</view>
|
|
<view class="text-[24rpx] text-[#333] leading-[34rpx] text-center mb-[60rpx]">{{ packInfo.info }}</view>
|
|
<view class="px-[68rpx] mb-[100rpx]">
|
|
<template v-for="(item,index) in packInfo.awards">
|
|
<template v-if="item.content">
|
|
<view class="flex items-center mb-[32rpx]" v-for="(subItem,subIndex) in item.content" :key="subIndex">
|
|
<image :src="img(subItem.icon)" class="w-[42rpx] h-[42rpx]" />
|
|
<view class="ml-[20rpx] text-[28rpx] text-[#303133] leading-[38rpx]">{{ subItem.text }}</view>
|
|
</view>
|
|
</template>
|
|
</template>
|
|
</view>
|
|
<view class="flex justify-center relative z-30">
|
|
<view class="w-[370rpx] h-[80rpx] border-[2rpx] text-[var(--primary-color)] border-solid rounded-[40rpx] border-[var(--primary-color)] text-center flex-center text-[26rpx] box-border" @click="packShow = false">我知道了</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="flex justify-center">
|
|
<text class="nc-iconfont nc-icon-cuohaoV6xx1 text-[#fff] text-[50rpx]" @click="packShow = false"></text>
|
|
</view>
|
|
</view>
|
|
</u-popup>
|
|
</view>
|
|
<loading-page :loading="loading"></loading-page>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { reactive, ref, toRefs, toRaw, computed } from 'vue'
|
|
import { redirect, img, pxToRpx } from '@/utils/common'
|
|
import { onLoad } from '@dcloudio/uni-app'
|
|
import { getSignInfo, getSignConfig, setSign, getDayPack } from '@/app/api/member'
|
|
import useMemberStore from '@/stores/member'
|
|
import { topTabar } from '@/utils/topTabbar'
|
|
import useSystemStore from "@/stores/system";
|
|
|
|
const state = reactive({
|
|
dataCount: [], //当月所有天数
|
|
weekCount: [], //如果签到周期是7天
|
|
curYear: 0, // 当前年
|
|
curMonth: 0, //当前月
|
|
curDate: 0, //当前日
|
|
curWeek: 0, //当前星期
|
|
signInList: [], // 签到列表
|
|
packList: [] //每个小周期内的礼包
|
|
})
|
|
const week = reactive({
|
|
weekDay: 0, //当前天
|
|
week: 0 //当前星期
|
|
})
|
|
const loading = ref(false)
|
|
const flag = ref(false)
|
|
const info: any = ref({}) //签到配置
|
|
const signPopup = ref(false)//签到规则弹框
|
|
const signAward: any = ref({}) //当日签到奖励
|
|
const awardShow = ref(false) // 每日签到弹框
|
|
const packShow = ref(false) //查看每天礼包
|
|
const packInfo = ref({}) //礼包奖励
|
|
const active = ref(false)
|
|
let currentYear: any = null
|
|
let currentMonth: any = null
|
|
onLoad(() => {
|
|
let date = new Date()
|
|
state.curYear = date.getFullYear()
|
|
state.curMonth = date.getMonth()
|
|
state.curDate = date.getDate()
|
|
state.curWeek = date.getDay()
|
|
if (state.curWeek == 0) state.curWeek = 7
|
|
|
|
currentYear = toRaw(state.curYear)
|
|
currentMonth = toRaw(state.curMonth)
|
|
|
|
//初始化执行
|
|
getDayCounts()
|
|
getWeekCounts()
|
|
getSignInfoFn({ year: state.curYear, month: state.curMonth + 1 })
|
|
getSignConfigFn()
|
|
})
|
|
|
|
// 获取签到配置
|
|
const getSignConfigFn = () => {
|
|
loading.value = true
|
|
getSignConfig().then((res: any) => {
|
|
info.value = res.data
|
|
if (!info.value.is_use) {
|
|
topTabbarData = topTabarObj.setTopTabbarParam({
|
|
title: '我的签到',
|
|
topStatusBar: { textColor: '#303133', bgColor: '#fff' }
|
|
})
|
|
}
|
|
loading.value = false
|
|
})
|
|
}
|
|
|
|
// 每个周期签到日期
|
|
const getSignInfoFn = (data: any) => {
|
|
getSignInfo(data).then((res: any) => {
|
|
state.signInList = []
|
|
state.packList = []
|
|
state.packList = res.data.period
|
|
if (res.data.length) {
|
|
state.signInList = res.data.days.map((el: any) => {
|
|
return Number(el)
|
|
})
|
|
}
|
|
|
|
active.value = true
|
|
})
|
|
}
|
|
|
|
//获取当月总天数
|
|
const getDayCounts = () => {
|
|
let counts = new Date(state.curYear, state.curMonth + 1, 0).getDate()
|
|
//获取当前第一天是星期几
|
|
let firstWeekDay = new Date(state.curYear, state.curMonth, 1).getDay()
|
|
state.dataCount = []
|
|
for (let i = 1; i < counts + firstWeekDay; i++) {
|
|
let val = i - firstWeekDay + 1
|
|
state.dataCount.push(val)
|
|
}
|
|
}
|
|
// 获取7天的日期签到
|
|
const getWeekCounts = () => {
|
|
let now = `${ state.curYear }-${ state.curMonth + 1 > 9 ? state.curMonth + 1 : '0' + (state.curMonth + 1) }-${ state.curDate > 9 ? state.curDate : '0' + state.curDate }`
|
|
for (let i = state.curWeek - 1; i >= 0; i--) {
|
|
const day = new Date(now).getDate() - i
|
|
state.weekCount.push(day)
|
|
}
|
|
for (let i = 1; i <= 7 - state.curWeek; i++) {
|
|
const day = new Date(now).getDate() + i
|
|
state.weekCount.push(day)
|
|
}
|
|
}
|
|
|
|
//控制状态
|
|
const handleChange = () => {
|
|
let nowDate = new Date().getMonth()
|
|
|
|
if (state.curMonth == nowDate) {
|
|
flag.value = !flag.value
|
|
} else {
|
|
state.curMonth = new Date().getMonth()
|
|
state.curYear = new Date().getFullYear()
|
|
getSignInfoFn({ year: state.curYear, month: state.curMonth + 1 })
|
|
flag.value = !flag.value
|
|
}
|
|
}
|
|
|
|
//更改月份
|
|
const changeMonth = (type: string) => {
|
|
state.dataCount = []
|
|
if (type == 'prev') {
|
|
state.curMonth--
|
|
if (state.curMonth < 0) {
|
|
state.curMonth = 11
|
|
state.curYear--
|
|
}
|
|
week.weekDay = 1
|
|
active.value = false
|
|
} else {
|
|
state.curMonth++
|
|
if (state.curMonth > 11) {
|
|
state.curMonth = 0
|
|
state.curYear++
|
|
}
|
|
week.weekDay = 1
|
|
active.value = false
|
|
}
|
|
let data = { year: state.curYear, month: state.curMonth + 1 }
|
|
getSignInfoFn(data)
|
|
getDayCounts()
|
|
}
|
|
|
|
const memberStore = useMemberStore()
|
|
|
|
// 点击签到
|
|
const setSignFn = () => {
|
|
setSign().then((res: any) => {
|
|
if (Object.values(res.data).length) {
|
|
signAward.value = res.data
|
|
// 如果没有奖励内容则不展示描述信息
|
|
let isShowInfo = 0
|
|
Object.values(signAward.value.awards).forEach((item: any, index) => {
|
|
if (!item.content) {
|
|
isShowInfo++;
|
|
}
|
|
})
|
|
if (isShowInfo == Object.values(signAward.value.awards).length) {
|
|
signAward.value.info = "";
|
|
}
|
|
getSignInfoFn({ year: state.curYear, month: state.curMonth + 1 })
|
|
getSignConfigFn()
|
|
memberStore.getMemberInfo()
|
|
awardShow.value = true
|
|
}
|
|
})
|
|
}
|
|
// 查看每日礼包
|
|
const curPickDay: any = ref(null)
|
|
const getDayPackFn = (date: number) => {
|
|
let { curYear, curMonth } = toRefs(state)
|
|
let itemDate = `${ curYear.value }-${ (curMonth.value + 1) < 10 ? '0' + (curMonth.value + 1) : (curMonth.value + 1) }-${ date < 10 ? '0' + date : date }`
|
|
let flag = state.packList.some(el => {
|
|
return el.day == itemDate
|
|
})
|
|
if (!flag) return
|
|
curPickDay.value = date
|
|
let obj = {
|
|
year: state.curYear,
|
|
month: state.curMonth + 1,
|
|
day: date
|
|
}
|
|
getDayPack(obj).then((res: any) => {
|
|
if (JSON.stringify(res.data) != '[]') {
|
|
packInfo.value = res.data
|
|
packShow.value = true
|
|
}
|
|
})
|
|
}
|
|
|
|
// 判断是否签到
|
|
const isVerDate = (val: any) => {
|
|
return state.signInList.includes(val)
|
|
}
|
|
|
|
//判断是否是当前日期
|
|
const isCurrentDate = (date: any) => {
|
|
if (date > 0 && date <= state.dataCount.length) {
|
|
if (date == state.curDate && currentYear == state.curYear && currentMonth == state.curMonth) {
|
|
return true
|
|
}
|
|
} else {
|
|
return false
|
|
}
|
|
}
|
|
|
|
const isPackDate = (date: any) => {
|
|
let { curYear, curMonth } = toRefs(state)
|
|
let itemDate = `${ curYear.value }-${ (curMonth.value + 1) < 10 ? '0' + (curMonth.value + 1) : (curMonth.value + 1) }-${ date < 10 ? '0' + date : date }`
|
|
let flag = state.packList.some((el: any) => {
|
|
return el.day == itemDate && el.award
|
|
})
|
|
return flag
|
|
}
|
|
|
|
// 过滤日期
|
|
const filteredDate = (date: any) => {
|
|
return date > 0 ? date : ''
|
|
}
|
|
|
|
const systemStore = useSystemStore()
|
|
/********* 自定义头部 - start ***********/
|
|
const topTabarObj = topTabar()
|
|
let topTabbarData = topTabarObj.setTopTabbarParam({ title: '我的签到' })
|
|
/********* 自定义头部 - end ***********/
|
|
|
|
const headStyle = computed(() => {
|
|
// #ifdef MP
|
|
let style = pxToRpx(Number(systemStore.menuButtonInfo.height) + systemStore.menuButtonInfo.top + 8) + 382 + 'rpx;'
|
|
// #endif
|
|
// #ifdef APP-PLUS
|
|
let style = pxToRpx(systemStore.systemInfo.statusBarHeight + 8) + 382 + 'rpx'
|
|
// #endif
|
|
return style
|
|
})
|
|
const topStyle = computed(() => {
|
|
// #ifdef MP
|
|
let style = pxToRpx(Number(systemStore.menuButtonInfo.height) + systemStore.menuButtonInfo.top + 8) + 50 + 'rpx;'
|
|
// #endif
|
|
// #ifdef APP-PLUS
|
|
let style = pxToRpx(systemStore.systemInfo.statusBarHeight + 8) + 50 + 'rpx'
|
|
// #endif
|
|
console.log(style)
|
|
return style
|
|
})
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.bg-color {
|
|
background-color: rgba(102, 102, 102, 0.4);
|
|
}
|
|
|
|
.sign-bg {
|
|
background: linear-gradient(90deg, #FFA359 0%, #FF5426 100%), #F2F2F2;
|
|
color: #fff !important;
|
|
}
|
|
|
|
:deep(.award-popup .u-popup__content) {
|
|
background-color: transparent;
|
|
}
|
|
|
|
.bg-award {
|
|
background: linear-gradient(51deg, #FFFBFC 0%, #FFFCF9 59%, #FFE7E7 100%);
|
|
}
|
|
|
|
.bg-button {
|
|
background: linear-gradient(180deg, #FFEAE1 0%, #FFCDD0 34%, #E0052C 100%);
|
|
border-radius: 40rpx;
|
|
}
|
|
.is-use {
|
|
background-color: #F6F6F6;
|
|
}
|
|
.mb20{
|
|
margin-bottom: 20rpx;
|
|
}
|
|
.mb30 {
|
|
margin-bottom: 30rpx;
|
|
}
|
|
.mt40 {
|
|
margin-top: 40rpx;
|
|
}
|
|
.filtered-date-wrap {
|
|
width: 74rpx;
|
|
height: 92rpx;
|
|
background-color: #f4f4f4;
|
|
color: var(--text-color-light6);
|
|
box-sizing: border-box;
|
|
padding-top: 10rpx;
|
|
padding-bottom: 10rpx;
|
|
border-radius: 8rpx;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
&.week-normal{
|
|
background-color: #f9f9f9 !important;
|
|
border: 1rpx solid #f5f5f5;
|
|
color: var(--text-color-light9) !important;
|
|
}
|
|
&.day-normal{
|
|
background-color: #FDFDFD !important;
|
|
border: 1rpx solid #F0F4FA;
|
|
}
|
|
}
|
|
</style>
|