websoft-uniapp/package/user/integral.vue

<template>
	<view class="page">
		<!-- 其他功能 -->
		<uni-card :border="false" :is-shadow="false" :padding="0">
			<view class="order-body web-cell web-cell-align-top">
				<view class="web-cell-content">
					<view class="integral-bar web-cell web-cell-content">
						<text class="web-text-placeholder">当前积分</text>
						<text class="integral web-text-heading">{{ userInfo.points }}</text>
					</view>
					<view class="sign-in-btn">
						<uv-button class="btn" :disabled="todaySign"
							:customStyle="{background: 'linear-gradient(to right, #70b915, #008e04)',borderRadius: '30px',color: '#ffffff'}"
							text="签到" @click="onSign"></uv-button>
					</view>
				</view>
			</view>
		</uni-card>

		<!-- 日历 -->
		<uni-calendar class="uni-calendar--hook" :selected="selected" :showMonth="true" @monthSwitch="onMonthSwitch" />

		<!-- 登录组件 -->
		<ws-login ref="login" :logo="logo" @done="reload" />
		
	</view>
</template>

<script>
	import {
		useUserStore
	} from '@/store/modules/user';
	import * as Api from '@/api/booking/integral';
	import {
		getWxOpenId
	} from '@/api/passport/login';
	import {
		openUrl
	} from '@/utils/common';

	import * as UserApi from '@/api/system/user'

	import {
		useTenantStore
	} from '@/store/modules/tenant';

	const tenantStore = useTenantStore();

	const userStore = useUserStore();

	const currentDate = new Date();
	const currentMonth = currentDate.getFullYear() + '-' + (currentDate.getMonth() + 1).toString().padStart(2, '0');

	export default {
		data() {
			return {
				userInfo: {},
				list: [],
				statusBarHeight: 104,
				isLogin: false,
				form: {
					name: '',
					phone: ''
				},
				dateTime: currentMonth,
				fields: {},
				logo: '',
				bookingUser: {},
				server: [],
				order: [],
				showCalendar: false,
				selected: [],
				todaySign: false
			}
		},
		onLoad() {
			this.reload()
		},
		onReady() {
			this.$nextTick(() => {
				this.showCalendar = true
			})
		},
		methods: {
			async reload(e) {
				const app = this
				const { dateTime } = this
				// uni.showLoading({
				// 	title: '请求中.'
				// })
				// 当前登录用户信息
				const userInfo = await userStore.fetchUserInfo();
				if (Object.keys(userInfo).length > 0) {
					app.isLogin = true
					app.userInfo = userInfo
				} else {
					app.isLogin = false
				}

				// 获取积分明细
				Api.getSignData({
					dateTime
				}).then(res => {
					uni.hideLoading()
					if (res.message == '您今天已经签到过了') {
						app.todaySign = true
					}
					app.selected = []
					res.data.map(d => {
						app.selected.push({
							date: d.dateTime,
							info: '已签到'
						})
					})
				})
			},
			navTo(item) {
				if (!this.isLogin) {
					this.$refs.login.open('bottom')
					return false;
				}
				openUrl(item);
			},
			// 弹出登录提示框
			openLogin() {
				if (!this.isLogin) {
					this.$refs.login.open('bottom')
					return false;
				}
			},
			onSign() {
				const app = this
				app.openLogin()
				app.todaySign = true
				Api.addIntegral({}).then(res => {
					UserApi.updatePointsBySign()
					app.userInfo.points++
					uni.showToast({
						title: '签到成功',
						icon: 'success'
					})
					setTimeout(() => {
						app.reload()
					},1000)
				}).catch((err) => {
					// uni.showToast({
					// 	title: err.message,
					// 	icon: 'none'
					// })
				})
				this.$forceUpdate();
			},
			onMonthSwitch(e) {
				this.dateTime = e.year + "-" + e.month.toString().padStart(2, '0')
				this.reload()
			}
		}
	}
</script>
<style>
	page {
		background: url('https://oss.wsdns.cn/20240502/75fc744657544a38a32f83a825688286.png') no-repeat;
		background-size: 100%;
		background-repeat: no-repeat;
		background-color: #f0f2f5;
		width: 750rpx;
		overflow-x: hidden;
	}
</style>
<style lang="scss">
	

	.integral-bar {
		flex-direction: column;
		padding: 30rpx 0;

		.integral {
			font-size: 50rpx;
			line-height: 2rem;
		}
	}

	.sign-in-btn {
		margin-bottom: 30rpx;

		.btn {
			width: 200rpx;
			margin: auto;
			margin-bottom: 50rpx;
		}
	}
</style>