修正布局,删改无用页面

This commit is contained in:
2026-06-24 08:13:12 +08:00
parent 8d8c823616
commit 0bebce3dc1
24 changed files with 2677 additions and 2796 deletions
+28 -2
View File
@@ -4,12 +4,28 @@ export function login(params) {
return request.post('/member/auth/miniapp/login', params)
}
/**
* 发送短信验证码
* @param {object} params - { phone: string }
*/
export function sendCode(params) {
return request.post('/member/auth/send-code', params)
return request.post('/auth/phone/send-code', params)
}
/**
* 手机号验证码登录
* @param {object} params - { phone: string, code: string }
*/
export function loginWithPhone(params) {
return request.post('/member/auth/phone-login', params)
return request.post('/auth/phone/code-login', params)
}
/**
* 手机号一键登录
* @param {object} params - { accessToken: string, openid: string, nickname?: string, avatar?: string }
*/
export function oneClickLogin(params) {
return request.post('/auth/phone/one-click-login', params)
}
export function logout() {
@@ -157,6 +173,14 @@ export function createPayment(params) {
return request.post('/payment/create', params)
}
/**
* 创建扫码支付订单
* @param {Object} params - 支付参数
*/
export function createQrCodePayment(params) {
return request.post('/payment/qrcode/create', params)
}
/**
* 查询支付状态
* @param {string} orderId - 订单ID
@@ -237,6 +261,7 @@ export default {
login,
sendCode,
loginWithPhone,
oneClickLogin,
logout,
getQRCode,
checkIn,
@@ -254,6 +279,7 @@ export default {
purchaseMemberCard,
getMyMemberCards,
createPayment,
createQrCodePayment,
getPaymentStatus,
refundPayment,
getRecommendCourses,
@@ -4,8 +4,6 @@
export const PAGE = {
INDEX: '/pages/index/index',
COURSE: '/pages/course/index',
TRAIN: '/pages/train/index',
DISCOVER: '/pages/discover/index',
MEMBER: '/pages/memberInfo/memberInfo',
BOOKING: '/pages/memberInfo/booking',
MEMBER_CARD: '/pages/memberInfo/memberCard',
@@ -40,8 +38,6 @@ export const PAGE = {
export const TAB_ROUTES = [
PAGE.INDEX,
PAGE.COURSE,
PAGE.TRAIN,
PAGE.DISCOVER,
PAGE.MEMBER
]
-15
View File
@@ -48,7 +48,6 @@ const HIDE_TABBAR_PAGES = [
'pages/memberInfo/bodyTestReport',
'pages/groupCourse/list',
'pages/groupCourse/detail',
'pages/searchCourse/searchCourse',
'pages/checkIn/checkIn',
'pages/memberInfo/myCourses',
'pages/memberInfo/coupons',
@@ -162,20 +161,6 @@ const tabs = [
useFontIcon: true,
fontSize:"36rpx"
},
{
path: PAGE.TRAIN,
icon: 'icon-train',
label: '训练',
useFontIcon: true,
fontSize:"48rpx"
},
{
path: PAGE.DISCOVER,
icon: 'icon-discover',
label: '发现',
useFontIcon: true,
fontSize:"48rpx"
},
{
path: PAGE.MEMBER,
icon: 'icon-profile',
@@ -121,6 +121,8 @@ const weekdays = ['日', '一', '二', '三', '四', '五', '六']
const quickOptions = [
{ label: '近7天', value: '7d' },
{ label: '近30天', value: '30d' },
{ label: '未来7天', value: 'future7d' },
{ label: '未来30天', value: 'future30d' },
{ label: '本月', value: 'month' },
{ label: '上月', value: 'lastMonth' }
]
@@ -218,12 +220,14 @@ function isToday(year, month, day) {
day === today.getDate()
}
// 判断是否是未来日期
// 判断是否是未来日期(限制最多选择未来90天)
function isFuture(year, month, day) {
const today = new Date()
today.setHours(0, 0, 0, 0)
const maxFuture = new Date(today)
maxFuture.setDate(maxFuture.getDate() + 90) // 最多允许选择未来90天
const date = new Date(year, month - 1, day)
return date > today
return date > maxFuture
}
// 切换日期选择器
@@ -273,7 +277,7 @@ const selectDate = (day) => {
console.log(`[TimeRangePicker] ${pickerType.value === 'start' ? '开始' : '结束'}日期变更:`, day.date)
}
// 应用快捷选项
// 应用快捷选项(所有日期计算基于当前真实时间)
const applyQuickOption = (value) => {
quickSelected.value = value
const today = new Date()
@@ -281,18 +285,32 @@ const applyQuickOption = (value) => {
switch (value) {
case '7d':
// 近7天:以今天为终点,往前推7天
startDate = new Date(today.getTime() - 7 * 24 * 60 * 60 * 1000)
endDate = today
break
case '30d':
// 近30天:以今天为终点,往前推30天
startDate = new Date(today.getTime() - 30 * 24 * 60 * 60 * 1000)
endDate = today
break
case 'future7d':
// 未来7天:以今天为起点,往后推7天
startDate = today
endDate = new Date(today.getTime() + 7 * 24 * 60 * 60 * 1000)
break
case 'future30d':
// 未来30天:以今天为起点,往后推30天
startDate = today
endDate = new Date(today.getTime() + 30 * 24 * 60 * 60 * 1000)
break
case 'month':
// 本月:当月1号到当月最后一天
startDate = new Date(today.getFullYear(), today.getMonth(), 1)
endDate = today
endDate = new Date(today.getFullYear(), today.getMonth() + 1, 0)
break
case 'lastMonth':
// 上月:上月1号到上月最后一天
startDate = new Date(today.getFullYear(), today.getMonth() - 1, 1)
endDate = new Date(today.getFullYear(), today.getMonth(), 0)
break
@@ -8,7 +8,6 @@
>
<view :class="['entry-icon', { accent: item.accent }]">
<image :src="item.icon" mode="aspectFit" class="icon-img" />
<view v-if="item.title === '消息' && hasUnread" class="badge-dot"></view>
</view>
<text class="entry-title">{{ item.title }}</text>
<text class="entry-desc">{{ item.desc }}</text>
@@ -30,148 +29,12 @@
</template>
<script setup>
import { ref, computed, onMounted } from 'vue'
import { getUnreadMessageCount } from '@/api/main.js'
import { ref } from 'vue'
const unreadCount = ref(0)
const showCheckInMenu = ref(false)
const TEST_MODE = false
// 是否有未读消息(用于显示红点)
const hasUnread = computed(() => unreadCount.value > 0)
const loadUnreadCount = async () => {
if (TEST_MODE) {
unreadCount.value = 3
return
}
const token = uni.getStorageSync('token')
if (!token) {
console.log('[QuickEntry] token 不存在,跳过请求')
unreadCount.value = 0
return
}
try {
const userId = uni.getStorageSync('userId') || 1
console.log('[QuickEntry] 请求未读消息数量, userId:', userId)
const res = await getUnreadMessageCount(userId)
console.log('[QuickEntry] 未读消息数量响应数据:', res)
console.log('[QuickEntry] 响应完整类型:', typeof res, Object.prototype.toString.call(res))
let count = 0
// 兼容多种响应格式
if (typeof res === 'number') {
count = res
console.log('[QuickEntry] 使用直接数字格式')
} else if (typeof res === 'string' && res.trim() !== '') {
// 处理字符串数字,如 "20"
count = parseInt(res, 10)
console.log('[QuickEntry] 使用字符串转数字格式:', count)
} else if (res !== null && typeof res === 'object') {
if (typeof res.count === 'number') {
count = res.count
console.log('[QuickEntry] 使用 res.count')
} else if (res.data !== undefined) {
if (typeof res.data === 'number') {
count = res.data
console.log('[QuickEntry] 使用 res.data')
} else if (typeof res.data?.count === 'number') {
count = res.data.count
console.log('[QuickEntry] 使用 res.data.count')
} else if (Array.isArray(res.data?.content)) {
count = res.data.content.length
console.log('[QuickEntry] 使用 res.data.content.length')
} else if (Array.isArray(res.content)) {
count = res.content.length
console.log('[QuickEntry] 使用 res.content.length')
} else if (typeof res.data?.total === 'number') {
count = res.data.total
console.log('[QuickEntry] 使用 res.data.total')
} else if (typeof res.total === 'number') {
count = res.total
console.log('[QuickEntry] 使用 res.total')
}
} else if (Array.isArray(res.content)) {
count = res.content.length
console.log('[QuickEntry] 使用 res.content.length')
} else if (typeof res.total === 'number') {
count = res.total
console.log('[QuickEntry] 使用 res.total')
}
} else {
console.log('[QuickEntry] 无法解析响应格式,res:', res)
}
unreadCount.value = count
uni.setStorageSync('unreadMessageCount', count)
console.log('[QuickEntry] 最终未读数量:', count, 'hasUnread:', hasUnread.value)
} catch (e) {
console.error('[QuickEntry] 获取未读消息数失败:', e)
try {
const count = uni.getStorageSync('unreadMessageCount')
unreadCount.value = count || 0
} catch (e2) {
unreadCount.value = 0
}
}
}
const handleEntryClick = (item) => {
if (item.title === '消息' || item.title === '健身数据') {
if (TEST_MODE) {
uni.showLoading({
title: '加载中...',
mask: true
})
setTimeout(() => {
uni.hideLoading()
if (item.isTabBar) {
uni.switchTab({ url: item.path })
} else {
uni.navigateTo({ url: item.path })
}
}, 300)
return
}
const token = uni.getStorageSync('token')
if (!token) {
uni.showModal({
title: '请登录',
content: '是否跳转到登录页面?',
confirmText: '确定',
cancelText: '取消',
confirmColor: '#FF6B35',
success: (res) => {
if (res.confirm) {
uni.navigateTo({
url: '/pages/login/login'
})
}
}
})
return
}
uni.showLoading({
title: '加载中...',
mask: true
})
setTimeout(() => {
uni.hideLoading()
if (item.title === '消息') {
uni.navigateTo({
url: `${item.path}?unreadCount=${unreadCount.value}`
})
} else if (item.isTabBar) {
uni.switchTab({ url: item.path })
} else {
uni.navigateTo({ url: item.path })
}
}, 300)
} else if (item.title === '签到') {
if (item.title === '签到') {
const token = uni.getStorageSync('token')
if (!token) {
uni.showModal({
@@ -192,7 +55,6 @@ const handleEntryClick = (item) => {
}
showCheckInMenu.value = !showCheckInMenu.value
} else if (item.path) {
// tabbar 页面使用 switchTab
if (item.isTabBar) {
uni.switchTab({
url: item.path
@@ -233,44 +95,14 @@ const handleGroupCourseCheckIn = () => {
})
}
onMounted(() => {
loadUnreadCount()
})
uni.$on('pageShow', () => {
loadUnreadCount()
})
const entries = [
{
icon: 'https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/icons/course.png',
title: '找课程',
desc: '精品课程',
accent: false,
path: "/pages/searchCourse/searchCourse"
path: "/pages/groupCourse/list"
},
{
icon: 'https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/icons/plan.png',
title: '训练计划',
desc: '个性定制',
accent: true,
path: "/pages/train/index",
isTabBar: true
},
{
icon: 'https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/icons/data.png',
title: '健身数据',
desc: '记录分析',
accent: false,
path: "/pages/memberInfo/bodyTestTrend"
},
{
icon: 'https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/icons/message.png',
title: '消息',
desc: '通知消息',
accent: true,
path: "/pages/message/index"
},
{
icon: 'https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/icons/checkIn.png',
title: '签到',
@@ -23,6 +23,7 @@
v-for="(course, index) in courses"
:key="course.id || index"
class="course-card"
@click="handleJoinCourse(course)"
>
<!-- 课程图片区域 -->
<view class="course-image">
@@ -30,8 +31,6 @@
<image :src="course.image" mode="aspectFill" class="img" />
<!-- 图片渐变遮罩 -->
<view class="course-overlay"></view>
<!-- 差几人提示右上角 -->
<text v-if="course.remainingSlots > 0" class="remaining-slots">{{ course.remainingSlots }}</text>
<!-- 课程信息区域 -->
<view class="course-info">
<!-- 课程名称 -->
@@ -50,10 +49,6 @@
<text>{{ course.level }}</text>
</view>
</view>
<!-- 课程标签 -->
<view class="meta-item course-type-tag">
<text :class="['tag', course.tagType]">{{ course.tag }}</text>
</view>
</view>
</view>
</view>
@@ -65,7 +60,7 @@
<text>{{ course.participants }}人参与</text>
</view>
<!-- 去参与按钮 -->
<view class="join-btn" @click="handleJoinCourse(course)">
<view class="join-btn" @click.stop="handleJoinCourse(course)">
<text>去参与</text>
</view>
</view>
@@ -82,28 +77,6 @@ import { getGroupCoursePage } from '@/api/main.js'
// 推荐课程数据列表
const courses = ref([])
// 课程类型映射(用于显示标签)
const getCourseTypeName = (type) => {
const typeMap = {
'1': '瑜伽',
'2': '搏击',
'3': '塑形'
}
return typeMap[type] || '课程'
}
// 根据课程信息获取标签文本
const getTag = (course) => {
if (course.currentMembers / course.maxMembers >= 0.8) return '热门'
return getCourseTypeName(course.courseType)
}
// 根据课程信息获取标签样式类型
const getTagType = (course) => {
if (course.currentMembers / course.maxMembers >= 0.8) return 'hot'
return 'default'
}
// 计算课程时长
const calculateDuration = (startTime, endTime) => {
if (!startTime || !endTime) return '60分钟'
@@ -142,19 +115,15 @@ const fetchRecommendCourses = async () => {
return course.status !== '2' && course.currentMembers < course.maxMembers
})
// 只取前5个符合条件的课程
courses.value = filteredCourses.slice(0, 5).map(course => {
const remainingSlots = course.maxMembers - course.currentMembers
// 只取前3个符合条件的课程
courses.value = filteredCourses.slice(0, 3).map(course => {
return {
id: course.id,
image: getImageUrl(course.coverImage),
tag: getTag(course),
tagType: getTagType(course),
name: course.courseName || '未知课程',
duration: calculateDuration(course.startTime, course.endTime),
level: getCourseLevel(course),
participants: course.currentMembers || 0,
remainingSlots: remainingSlots,
rawData: course
}
})
@@ -250,50 +219,6 @@ onMounted(() => { fetchRecommendCourses() })
background: linear-gradient(to top, rgba(45, 74, 90, 0.7) 0%, transparent 60%);
}
.remaining-slots {
position: absolute;
top: 16rpx;
right: 16rpx;
padding: 6rpx 12rpx;
border-radius: 10rpx;
font-size: 20rpx;
font-weight: 600;
color: #ffffff;
background: linear-gradient(135deg, #FF6B35, #FF8F66);
z-index: 3;
}
.course-tag {
position: absolute;
top: 16rpx;
right: 16rpx;
padding: 6rpx 12rpx;
border-radius: 10rpx;
font-size: 20rpx;
font-weight: 600;
color: #ffffff;
background: linear-gradient(135deg, #7AB5CC, #9CCFDF);
z-index: 2;
&.hot {
background: linear-gradient(135deg, #6BA8C0, #8CC5D5);
}
&.new {
background: linear-gradient(135deg, #6DB5C8, #90CEDD);
}
&.free {
background: linear-gradient(135deg, #7AB5CC, #9CCFDF);
}
&.full {
background: linear-gradient(135deg, #A0B8C8, #B8CCD8);
}
&.ended {
background: linear-gradient(135deg, #B0C0CC, #C4D2DC);
}
&.default {
background: linear-gradient(135deg, #7AB5CC, #9CCFDF);
}
}
.course-info {
position: absolute;
left: 0;
@@ -349,21 +274,6 @@ onMounted(() => { fetchRecommendCourses() })
background: rgba(255, 255, 255, 0.25);
}
.course-type-tag {
background: transparent !important;
padding: 0 !important;
.tag {
padding: 4rpx 10rpx;
border-radius: 6rpx;
font-size: 20rpx;
font-weight: 600;
background: linear-gradient(135deg, #FF8F66, #FFB088);
color: #ffffff;
&.hot {
background: linear-gradient(135deg, #FF6B35, #FF8F66);
}
}
}
.meta-icon {
width: 22rpx;
@@ -5,13 +5,6 @@
<view class="section-header">
<!-- 区域标题 -->
<text class="section-title">今日推荐</text>
<!-- 查看更多按钮 -->
<view class="view-more" @click="handleViewMore">
<text>查看更多</text>
<text class="arrow">
<uni-icons type="right" size="20" color="#8CA0B0"></uni-icons>
</text>
</view>
</view>
<!-- 推荐列表 -->
@@ -19,8 +12,9 @@
<!-- 推荐项 -->
<view
v-for="(item, index) in recommends"
:key="index"
:key="item.id || index"
class="recommend-item"
@click="handleItemClick(item)"
>
<!-- 推荐项图片 -->
<image :src="item.image" mode="aspectFill" class="item-image" />
@@ -38,7 +32,7 @@
<!-- 推荐项操作区域 -->
<view class="item-action">
<!-- 开始训练按钮 -->
<view class="start-btn">
<view class="start-btn" @click.stop="handleItemClick(item)">
<text class="start-btn-text">开始训练</text>
</view>
<!-- 参与人数 -->
@@ -50,34 +44,71 @@
</template>
<script setup>
const handleViewMore = () => {
uni.navigateTo({ url: '/pages/discover/index' })
}
import { ref, onMounted } from 'vue'
import { getGroupCoursePage } from '@/api/main.js'
// 今日推荐数据列表
const recommends = [
{
image: 'https://images.unsplash.com/photo-1571019613454-1cb2f99b2d8b?w=300&q=80',
title: '晨间活力唤醒跑',
tags: ['20分钟', '初级'],
desc: '唤醒身体,开启活力一天',
participants: '2784'
},
{
image: 'https://images.unsplash.com/photo-1517836357463-d25dfeac3438?w=300&q=80',
title: '全身力量塑形',
tags: ['50分钟', '中级'],
desc: '全身综合训练,塑造完美线条',
participants: '4126'
},
{
image: 'https://images.unsplash.com/photo-1490645935967-10de6ba17061?w=300&q=80',
title: '蛋白增肌饮食指南',
tags: ['营养饮食', '12分钟'],
desc: '科学饮食搭配,助力肌肉增长',
participants: '1865'
const recommends = ref([])
// 计算课程时长
const calculateDuration = (startTime, endTime) => {
if (!startTime || !endTime) return '60分钟'
const start = new Date(startTime)
const end = new Date(endTime)
const diffMs = end - start
if (diffMs <= 0) return ''
const durationMinutes = Math.floor(diffMs / (1000 * 60))
return `${durationMinutes}分钟`
}
// 获取课程难度
const getCourseLevel = (course) => {
if (course.courseType === '2') return '中级'
if (course.courseType === '3') return '高级'
if (course.courseType === '1') return '初级'
return '初级'
}
// 处理图片URL
const getImageUrl = (coverImage) => {
if (!coverImage) return 'https://images.unsplash.com/photo-1571019613454-1cb2f99b2d8b?w=300&q=80'
if (coverImage.startsWith('http')) return coverImage
return `https://your-domain.com${coverImage}`
}
// 获取今日推荐
const fetchTodayRecommend = async () => {
try {
const res = await getGroupCoursePage({
page: 0, size: 10, sort: 'current_members', order: 'desc'
}, { cache: true, cacheTime: 5 * 60 * 1000 })
if (res && res.content && Array.isArray(res.content)) {
const filteredCourses = res.content.filter(course => {
return course.status !== '2' && course.currentMembers < course.maxMembers
})
recommends.value = filteredCourses.slice(0, 3).map(course => {
return {
id: course.id,
image: getImageUrl(course.coverImage),
title: course.courseName || '未知课程',
tags: [calculateDuration(course.startTime, course.endTime), getCourseLevel(course)],
desc: course.description || '精彩课程,不容错过',
participants: String(course.currentMembers || 0)
}
})
}
} catch (err) {
console.error('获取今日推荐失败:', err)
}
]
}
const handleItemClick = (item) => {
if (!item.id) { uni.showToast({ title: '课程信息不完整', icon: 'none' }); return }
uni.navigateTo({ url: `/pages/groupCourse/detail?id=${item.id}` })
}
onMounted(() => { fetchTodayRecommend() })
</script>
<style lang="scss" scoped>
@@ -100,18 +131,6 @@ const recommends = [
color: #2D4A5A;
}
.view-more {
display: flex;
align-items: center;
gap: 4rpx;
font-size: 26rpx;
color: var(--tabbar-text-inactive);
}
.arrow {
font-size: 32rpx;
}
.recommend-list {
display: flex;
flex-direction: column;
@@ -1,25 +1,5 @@
<template>
<view class="profile-header">
<!-- 顶栏白底居中标题左侧放通知/设置右侧留胶囊安全区 -->
<view class="profile-header__toolbar" :style="toolbarStyle">
<view class="profile-header__nav">
<view class="profile-header__nav-left">
<image
class="profile-header__icon-bell"
src="https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/images/bell.png"
mode="aspectFit"
/>
<image
class="profile-header__icon-settings"
src="https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/images/settings.png"
mode="aspectFit"
/>
</view>
<text class="profile-header__title">个人中心</text>
<view class="profile-header__nav-right" :style="navRightStyle"></view>
</view>
</view>
<view class="profile-header__toolbar-spacer" :style="toolbarSpacerStyle"></view>
<!-- 用户信息区深蓝渐变 -->
<view class="profile-header__hero">
<view class="profile-header__inner" v-if="isLogin">
@@ -109,7 +89,7 @@
</template>
<script setup>
import { ref, computed, onMounted } from 'vue'
import { computed } from 'vue'
const props = defineProps({
userInfo: { type: Object, required: true },
@@ -133,41 +113,6 @@ function handleUserTap() {
function handleGuestLogin() {
emit('guest-login')
}
const toolbarStyle = ref({})
const toolbarSpacerStyle = ref({})
const navRightStyle = ref({})
function syncNavSafeArea() {
try {
const sys = uni.getSystemInfoSync()
const statusBarHeight = sys.statusBarHeight || 0
const navHeight = 44
const menu = uni.getMenuButtonBoundingClientRect?.()
toolbarStyle.value = {
paddingTop: `${statusBarHeight}px`
}
toolbarSpacerStyle.value = {
height: `${statusBarHeight + navHeight}px`
}
if (menu && menu.width) {
const capsuleGap = sys.windowWidth - menu.left + 8
navRightStyle.value = {
width: `${capsuleGap}px`,
minWidth: `${capsuleGap}px`
}
}
} catch (e) {
toolbarSpacerStyle.value = { height: '44px' }
}
}
onMounted(() => {
syncNavSafeArea()
})
</script>
<style lang="scss">
@@ -4,60 +4,7 @@
<view class="quick-actions__grid">
<view class="quick-actions__grid-inner">
<view
v-for="item in row1"
:key="item.key"
class="quick-actions__item"
hover-class="mi-tap--hover"
:hover-stay-time="150"
@tap="$emit('action', item.key)"
>
<view class="quick-actions__item-inner">
<view class="quick-actions__icon-wrap">
<view class="quick-actions__icon-wrap-inner">
<view v-if="item.key === 'booking'" class="quick-actions__icon">
<image
class="quick-actions__icon-part"
src="https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/images/Vector_2_490.png"
mode="aspectFit"
/>
<image
class="quick-actions__icon-part"
src="https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/images/Vector_2_491.png"
mode="aspectFit"
/>
<view class="quick-actions__border-wrap">
<view class="quick-actions__rect"></view>
<view class="quick-actions__border"></view>
</view>
<image
class="quick-actions__icon-part"
src="https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/images/Vector_2_493.png"
mode="aspectFit"
/>
<image
class="quick-actions__icon-part"
src="https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/images/Vector_2_494.png"
mode="aspectFit"
/>
</view>
<image
v-else
class="quick-actions__icon-img"
:src="item.icon"
mode="aspectFit"
/>
</view>
</view>
<text :class="item.textClass">{{ item.label }}</text>
</view>
</view>
</view>
</view>
<view class="quick-actions__divider"></view>
<view class="quick-actions__grid">
<view class="quick-actions__grid-inner">
<view
v-for="item in row2"
v-for="item in actions"
:key="item.key"
class="quick-actions__item"
hover-class="mi-tap--hover"
@@ -88,18 +35,9 @@ import { ref } from 'vue'
defineEmits(['action'])
const row1 = ref([
{ key: 'booking', label: '预约课程', textClass: 'quick-actions__title', icon: '' },
{ key: 'bodyTest', label: '智能体测', textClass: 'quick-actions__title-2', icon: 'https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/images/mappin2.png' },
{ key: 'bodyReport', label: '体测报告', textClass: 'quick-actions__title-3', icon: 'https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/images/activity.png' },
{ key: 'trainReport', label: '训练报告', textClass: 'quick-actions__coach', icon: 'https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/images/usercheck.png' }
])
const row2 = ref([
{ key: 'coupon', label: '我的优惠券', textClass: 'quick-actions__text', icon: 'https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/images/ticket.png' },
{ key: 'points', label: '我的积分', textClass: 'quick-actions__points-desc', icon: 'https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/images/star.png' },
{ key: 'referral', label: '邀请好友', textClass: 'quick-actions__title-4', icon: 'https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/images/share2.png' },
{ key: 'course', label: '我的课程', textClass: 'quick-actions__text-2', icon: 'https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/images/play.png' }
const actions = ref([
{ key: 'coupon', label: '我的优惠券', textClass: 'quick-actions__title', icon: 'https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/images/ticket.png' },
{ key: 'points', label: '我的积分', textClass: 'quick-actions__points-desc', icon: 'https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/images/star.png' }
])
</script>
@@ -61,12 +61,6 @@ import { ref } from 'vue'
defineEmits(['setting'])
const items = ref([
{
key: 'notify',
label: '通知设置',
icon: 'https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/images/bell.png',
iconWrapClass: ''
},
{
key: 'password',
label: '修改密码',
@@ -79,13 +73,6 @@ const items = ref([
icon: 'https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/images/shield.png',
iconWrapClass: 'settings-section__item-icon-wrap--green'
},
{
key: 'nfc',
label: 'NFC 门禁卡',
subtitle: '已绑定',
icon: 'https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/images/ticket.png',
iconWrapClass: ''
},
{
key: 'delete',
label: '注销账户',
@@ -1,60 +1,43 @@
<template>
<!-- 推荐团课卡片 -->
<view class="recommend-card" :style="cardStyle" @click="handleCardClick">
<!-- 卡片头部推荐信息 -->
<!-- 卡片头部图片 + 推荐标题 -->
<view class="card-header">
<text class="recommend-title">{{ recommend.recommendTitle || '推荐课程' }}</text>
<text class="recommend-content">{{ recommend.recommendContent }}</text>
<view class="recommend-reason" v-if="recommend.recommendReason">
<text class="reason-label">推荐理由</text>
<text class="reason-text">{{ recommend.recommendReason }}</text>
</view>
</view>
<!-- 分割线 -->
<view class="divider"></view>
<!-- 卡片主体团课信息 -->
<view class="card-body">
<!-- 团课封面 -->
<view class="course-image-wrapper">
<image :src="courseImage" mode="aspectFill" class="course-image" />
<view class="image-overlay"></view>
<!-- 状态标签 -->
<text :class="['status-tag', tagType]">{{ tagText }}</text>
</view>
<!-- 团课详情 -->
<view class="course-info">
<text class="course-name">{{ courseName }}</text>
<!-- 课程标签 -->
<view class="course-tags">
<text :class="['course-tag', tagType]">{{ tagText }}</text>
<text class="course-type">{{ courseTypeName }}</text>
</view>
<!-- 课程时间 -->
<view class="course-time" v-if="courseStartTime">
<text class="time-icon">📅</text>
<text class="time-text">{{ formattedTime }}</text>
</view>
<!-- 地点 -->
<view class="course-location" v-if="courseLocation">
<text class="location-icon">📍</text>
<text class="location-text">{{ courseLocation }}</text>
</view>
<!-- 参与人数 -->
<view class="course-members">
<text class="members-icon">🔥</text>
<text class="members-text">{{ courseCurrentMembers || 0 }}/{{ courseMaxMembers || 0 }}</text>
</view>
<!-- 课程描述 -->
<text class="course-description" v-if="courseDescription">{{ courseDescription }}</text>
<!-- 推荐标题区 -->
<view class="header-info">
<text class="recommend-title">{{ recommend.recommendTitle || '推荐课程' }}</text>
<text class="recommend-content">{{ recommend.recommendContent }}</text>
</view>
</view>
<!-- 课程信息栏 -->
<view class="info-bar">
<view class="info-item">
<image src="https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/time.png" class="info-icon" />
<text class="info-text">{{ formattedTime }}</text>
</view>
<view class="info-item" v-if="courseLocation">
<image src="https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/intensity.png" class="info-icon" />
<text class="info-text">{{ courseLocation }}</text>
</view>
<view class="info-item">
<image src="https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/hot.png" class="info-icon" />
<text class="info-text">{{ courseCurrentMembers || 0 }}/{{ courseMaxMembers || 0 }}</text>
</view>
</view>
<!-- 推荐理由 -->
<view class="card-reason" v-if="recommend.recommendReason">
<text class="reason-text">{{ recommend.recommendReason }}</text>
</view>
<!-- 卡片底部操作按钮 -->
<view class="card-footer" @click.stop="handleJoinCourse">
<view class="action-btn">
@@ -98,13 +81,11 @@ const cardStyle = computed(() => {
})
// 团课信息
const courseName = computed(() => props.recommend.groupCourse?.courseName || '未知课程')
const courseStartTime = computed(() => props.recommend.groupCourse?.startTime)
const courseEndTime = computed(() => props.recommend.groupCourse?.endTime)
const courseMaxMembers = computed(() => props.recommend.groupCourse?.maxMembers)
const courseCurrentMembers = computed(() => props.recommend.groupCourse?.currentMembers)
const courseLocation = computed(() => props.recommend.groupCourse?.location)
const courseDescription = computed(() => props.recommend.groupCourse?.description)
const courseId = computed(() => props.recommend.groupCourse?.id)
// 课程封面图片
@@ -115,16 +96,6 @@ const courseImage = computed(() => {
return `https://your-domain.com${coverImage}`
})
// 课程类型映射
const courseTypeName = computed(() => {
const typeMap = {
1: '瑜伽',
2: '搏击',
3: '塑形'
}
return typeMap[props.recommend.groupCourse?.courseType] || '课程'
})
// 课程标签文本
const tagText = computed(() => {
const current = courseCurrentMembers.value || 0
@@ -194,6 +165,7 @@ const handleJoinCourse = () => {
<style lang="scss">
.recommend-card {
width: 100%;
background: rgba(255, 255, 255, 0.95);
backdrop-filter: blur(16px);
-webkit-backdrop-filter: blur(16px);
@@ -204,63 +176,16 @@ const handleJoinCourse = () => {
margin-bottom: 24rpx;
}
// 卡片头部
// 卡片头部:左图右文
.card-header {
padding: 24rpx;
background: linear-gradient(135deg, rgba(124, 181, 204, 0.1), rgba(156, 207, 223, 0.05));
}
.recommend-title {
font-size: 32rpx;
font-weight: 700;
color: #2D4A5A;
margin-bottom: 12rpx;
display: block;
}
.recommend-content {
display: block;
font-size: 26rpx;
color: #5A7A8A;
line-height: 1.6;
margin-bottom: 12rpx;
}
.recommend-reason {
display: flex;
align-items: flex-start;
gap: 8rpx;
}
.reason-label {
font-size: 24rpx;
color: #8CA0B0;
flex-shrink: 0;
}
.reason-text {
font-size: 24rpx;
color: #6A8A9A;
line-height: 1.5;
}
// 分割线
.divider {
height: 1rpx;
background: linear-gradient(90deg, transparent, rgba(124, 181, 204, 0.3), transparent);
margin: 0 24rpx;
}
// 卡片主体
.card-body {
padding: 24rpx;
display: flex;
gap: 24rpx;
padding: 24rpx;
}
.course-image-wrapper {
width: 200rpx;
height: 200rpx;
width: 160rpx;
height: 160rpx;
border-radius: 16rpx;
overflow: hidden;
position: relative;
@@ -278,33 +203,17 @@ const handleJoinCourse = () => {
right: 0;
top: 0;
bottom: 0;
background: linear-gradient(to top, rgba(45, 74, 90, 0.4) 0%, transparent 50%);
background: linear-gradient(to top, rgba(45, 74, 90, 0.3) 0%, transparent 60%);
}
// 团课详情
.course-info {
flex: 1;
display: flex;
flex-direction: column;
gap: 12rpx;
}
.course-name {
font-size: 30rpx;
font-weight: 600;
color: #2D4A5A;
}
.course-tags {
display: flex;
align-items: center;
gap: 12rpx;
}
.course-tag {
padding: 6rpx 16rpx;
border-radius: 10rpx;
font-size: 20rpx;
// 状态标签(图片左下角)
.status-tag {
position: absolute;
left: 8rpx;
bottom: 8rpx;
padding: 4rpx 12rpx;
border-radius: 8rpx;
font-size: 18rpx;
font-weight: 600;
color: #ffffff;
background: linear-gradient(135deg, #7CB5CC, #9CCFDF);
@@ -319,41 +228,72 @@ const handleJoinCourse = () => {
}
}
.course-type {
font-size: 22rpx;
color: #8CA0B0;
}
.course-time,
.course-location,
.course-members {
// 推荐标题区
.header-info {
flex: 1;
display: flex;
align-items: center;
gap: 8rpx;
flex-direction: column;
justify-content: center;
min-width: 0;
}
.time-icon,
.location-icon,
.members-icon {
font-size: 24rpx;
}
.time-text,
.location-text,
.members-text {
font-size: 24rpx;
color: #5A7A8A;
}
.course-description {
font-size: 24rpx;
color: #8CA0B0;
line-height: 1.5;
.recommend-title {
font-size: 32rpx;
font-weight: 700;
color: #2D4A5A;
margin-bottom: 8rpx;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.recommend-content {
font-size: 24rpx;
color: #5A7A8A;
line-height: 1.5;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
// 信息栏:时间 | 地点 | 人数
.info-bar {
display: flex;
align-items: center;
gap: 24rpx;
padding: 0 24rpx 16rpx;
}
.info-item {
display: flex;
align-items: center;
gap: 6rpx;
}
.info-icon {
width: 28rpx;
height: 28rpx;
}
.info-text {
font-size: 22rpx;
color: #5A7A8A;
}
// 推荐理由
.card-reason {
margin: 0 24rpx;
padding: 16rpx;
background: rgba(124, 181, 204, 0.06);
border-radius: 12rpx;
border-left: 4rpx solid #7CB5CC;
}
.reason-text {
font-size: 22rpx;
color: #6A8A9A;
line-height: 1.5;
}
// 卡片底部
@@ -363,9 +303,9 @@ const handleJoinCourse = () => {
.action-btn {
width: 100%;
height: 80rpx;
height: 72rpx;
background: linear-gradient(135deg, #82DC82, #66CC66);
border-radius: 40rpx;
border-radius: 36rpx;
display: flex;
align-items: center;
justify-content: center;
@@ -41,6 +41,9 @@ export function useGroupCourseList() {
const filteredCourseList = computed(() => {
let result = [...courseList.value]
// 只显示可预约的团课(状态码为0,兼容字符串和数字)
result = result.filter(course => Number(course.status) === 0)
if (searchKeyword.value) {
result = result.filter(course =>
course.courseName.includes(searchKeyword.value)
@@ -215,8 +218,11 @@ export function useGroupCourseList() {
console.log('[useGroupCourseList] 响应结果:', JSON.stringify(result, null, 2))
if (result && result.data && result.data.content) {
const { content: list, totalElements: totalCount, currentPage: respPage, totalPages: pages } = result.data
// 兼容后端统一响应格式 { data/result, message, success }
const wrapped = result?.result || result?.data || result
if (wrapped && wrapped.content) {
const { content: list, totalElements: totalCount, totalPages: pages } = wrapped
if (isLoadMore) {
courseList.value = [...courseList.value, ...list]
+1865 -448
View File
File diff suppressed because it is too large Load Diff
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name" : "活氧舱",
"appid" : "__UNI__52E2F0D",
"appid" : "__UNI__F058AC0",
"description" : "",
"versionName" : "1.0.0",
"versionCode" : "100",
+1 -28
View File
@@ -22,26 +22,7 @@
}
}
},
{
"path": "pages/train/index",
"style": {
"navigationBarTitleText": "训练",
"app-plus": {
"animationType": "fade-in",
"animationDuration": 200
}
}
},
{
"path": "pages/discover/index",
"style": {
"navigationBarTitleText": "发现",
"app-plus": {
"animationType": "fade-in",
"animationDuration": 200
}
}
},
{
"path": "pages/memberInfo/memberInfo",
"style": {
@@ -276,12 +257,6 @@
"navigationBarTitleText": ""
}
},
{
"path": "pages/searchCourse/searchCourse",
"style": {
"navigationBarTitleText": "搜索课程"
}
},
{
"path": "pages/recommendCourses/index",
"style": {
@@ -331,8 +306,6 @@
"list": [
{ "pagePath": "pages/index/index", "text": "首页" },
{ "pagePath": "pages/course/index", "text": "课程" },
{ "pagePath": "pages/train/index", "text": "训练" },
{ "pagePath": "pages/discover/index", "text": "发现" },
{ "pagePath": "pages/memberInfo/memberInfo", "text": "我的" }
]
}
-136
View File
@@ -1,136 +0,0 @@
<template>
<!-- 滚动内容区域 -->
<scroll-view scroll-y class="scroll-container">
<view class="tab-page">
<view class="tab-page__header">
<text class="tab-page__title">发现</text>
<text class="tab-page__subtitle">活动 · 资讯 · 今日推荐</text>
</view>
<TodayRecommend />
<view class="discover-links">
<view class="discover-link" hover-class="discover-link--hover" @tap="goReferral">
<text class="discover-link__title">邀请好友</text>
<text class="discover-link__desc">邀请注册/购课双方得积分</text>
</view>
<view class="discover-link" hover-class="discover-link--hover" @tap="goCouponCenter">
<text class="discover-link__title">领券中心</text>
<text class="discover-link__desc">限时优惠券先到先得</text>
</view>
<view class="discover-link" hover-class="discover-link--hover" @tap="goPointsMall">
<text class="discover-link__title">积分商城</text>
<text class="discover-link__desc">积分兑换好礼</text>
</view>
</view>
<view class="bottom-placeholder"></view>
</view>
</scroll-view>
<!-- 固定 TabBar -->
<view class="tabbar-fixed">
<TabBar :active="3" />
</view>
</template>
<script setup>
import TodayRecommend from '@/components/index/TodayRecommend.vue'
import TabBar from '@/components/TabBar.vue'
import { PAGE, navigateToPage } from '@/common/constants/routes.js'
function goReferral() {
navigateToPage(PAGE.REFERRAL)
}
function goCouponCenter() {
navigateToPage(PAGE.COUPON_CENTER)
}
function goPointsMall() {
navigateToPage(PAGE.POINTS_MALL)
}
</script>
<style lang="scss" scoped>
.tab-page {
min-height: 100vh;
padding-bottom: 160rpx;
position: relative;
z-index: 1;
}
.tab-page__header {
padding: 48rpx 32rpx 16rpx;
}
.tab-page__title {
display: block;
font-size: 40rpx;
font-weight: $font-weight-bold;
color: $text-dark;
}
.tab-page__subtitle {
display: block;
margin-top: 8rpx;
font-size: 24rpx;
color: $text-muted;
}
.discover-links {
display: flex;
flex-direction: column;
gap: 16rpx;
padding: 24rpx 32rpx;
}
.discover-link {
padding: 24rpx 28rpx;
border-radius: $radius-md;
background: $bg-white;
box-shadow: $shadow-sm;
border: 1px solid $border-light;
transition: all 0.2s ease;
}
.discover-link:active {
transform: scale(0.98);
}
.discover-link__title {
display: block;
font-size: 28rpx;
font-weight: $font-weight-bold;
color: $text-dark;
}
.discover-link__desc {
display: block;
margin-top: 6rpx;
font-size: 22rpx;
color: $text-muted;
}
.bottom-placeholder {
height: 40rpx;
}
/* 滚动容器 */
.scroll-container {
position: relative;
z-index: 1;
height: 100vh;
width: 100%;
}
/* 固定 TabBar */
.tabbar-fixed {
position: fixed;
bottom: 0;
left: 0;
right: 0;
z-index: 1000;
background-color: transparent;
}
</style>
+63 -33
View File
@@ -125,18 +125,9 @@
<script setup>
import { ref, computed, onUnmounted } from 'vue'
import { setToken } from '@/utils/request.js'
import { loginWithPhone, oneClickLogin, sendCode } from '@/api/main.js'
// 测试数据
const TEST_TOKEN = 'test_token_123456'
const TEST_MEMBER_INFO = {
memberId: 10001,
memberNo: 'M001',
phone: '13800138000',
nickname: '测试用户',
avatar: '/static/logo.png',
accessToken: TEST_TOKEN,
isNewUser: false
}
// 调用真实后端API,不再使用测试数据
const activeCard = ref('phone')
const phone = ref('')
@@ -230,16 +221,31 @@ async function handlePhoneLogin() {
isLoading.value = true
setTimeout(() => {
setToken(TEST_TOKEN)
uni.setStorageSync('memberInfo', TEST_MEMBER_INFO)
uni.setStorageSync('isLogin', true)
showToast('登录成功')
setTimeout(() => {
uni.switchTab({ url: '/pages/memberInfo/memberInfo' })
}, 1500)
try {
const res = await oneClickLogin({
accessToken: phone.value,
openid: 'uniapp_phone_login',
nickname: '',
avatar: ''
})
if (res && res.accessToken) {
setToken(res.accessToken)
uni.setStorageSync('memberInfo', res)
uni.setStorageSync('isLogin', true)
showToast('登录成功')
setTimeout(() => {
uni.switchTab({ url: '/pages/memberInfo/memberInfo' })
}, 1500)
} else {
showToast('登录失败,请重试')
}
} catch (err) {
console.error('一键登录失败:', err)
showToast(err?.message || '登录失败,请重试')
} finally {
isLoading.value = false
}, 500)
}
}
function triggerAgreementShake() {
@@ -260,12 +266,22 @@ async function handleSendCode() {
isLoading.value = true
setTimeout(() => {
countdown.value = 300
startCountdown()
showToast('验证码已发送')
try {
const res = await sendCode({ phone: smsPhone.value })
if (res && res.success) {
countdown.value = 60
startCountdown()
showToast('验证码已发送')
} else {
showToast(res?.message || '验证码发送失败')
}
} catch (err) {
console.error('发送验证码失败:', err)
showToast(err?.message || '验证码发送失败')
} finally {
isLoading.value = false
}, 300)
}
}
function startCountdown() {
@@ -297,15 +313,29 @@ async function handleSmsLogin() {
isLoading.value = true
setTimeout(() => {
setToken(TEST_TOKEN)
uni.setStorageSync('memberInfo', TEST_MEMBER_INFO)
showToast('登录成功')
setTimeout(() => {
uni.switchTab({ url: '/pages/memberInfo/memberInfo' })
}, 1500)
try {
const res = await loginWithPhone({
phone: smsPhone.value,
code: code.value
})
if (res && res.accessToken) {
setToken(res.accessToken)
uni.setStorageSync('memberInfo', res)
uni.setStorageSync('isLogin', true)
showToast('登录成功')
setTimeout(() => {
uni.switchTab({ url: '/pages/memberInfo/memberInfo' })
}, 1500)
} else {
showToast('登录失败,请重试')
}
} catch (err) {
console.error('验证码登录失败:', err)
showToast(err?.message || '登录失败,请重试')
} finally {
isLoading.value = false
}, 500)
}
}
onUnmounted(() => {
@@ -1,64 +1,57 @@
<template>
<view class="member-info-page">
<!-- 滚动内容区域 -->
<scroll-view scroll-y class="scroll-container theme-light">
<view class="member-scroll-wrap">
<scroll-view scroll-y class="member-scroll">
<view class="member-page">
<MemberInfoHeader
:user-info="userInfo"
:stats="stats"
:isLogin="isLogin"
@user-info="goUserInfo"
@guest-login="handleGuestLogin"
/>
<view class="member-page__body">
<view class="member-page__sections">
<MemberInfoMemberCard
:card-info="cardInfo"
@view-all="goMemberCard"
@renew="onRenewCard"
@purchase="goPurchaseCard"
/>
<MemberInfoQuickActions @action="onQuickAction" />
<MemberInfoBookingList
v-if="isLogin"
:items="bookingPreview"
@view-all="goBooking"
@item-tap="goBooking"
/>
<MemberInfoCheckInList
v-if="isLogin"
:items="checkIns"
@view-all="onCheckInViewAll"
@item-tap="onCheckInTap"
/>
<MemberInfoBodyReport
v-if="isLogin"
:report="bodyReport"
@view-history="onBodyReportHistory"
@view-report="onBodyReportView"
/>
<MemberInfoCouponPoints
v-if="isLogin"
:data="couponPoints"
@view-all="onCouponViewAll"
@use-coupon="onUseCoupon"
@redeem-points="onRedeemPoints"
/>
<MemberInfoReferral
v-if="isLogin"
:data="referral"
@view-rules="onReferralRules"
/>
<MemberInfoSettings v-if="isLogin" @setting="onSetting" />
<MemberInfoLogout v-if="isLogin" @logout="handleLogout" />
</view>
<MemberInfoHeader
:user-info="userInfo"
:stats="stats"
:is-login="isLogin"
@user-info="goUserInfo"
@guest-login="handleGuestLogin"
/>
<view class="member-page__body">
<view class="member-page__sections">
<MemberInfoMemberCard
:card-info="cardInfo"
@view-all="goMemberCard"
@renew="onRenewCard"
@purchase="goPurchaseCard"
/>
<MemberInfoQuickActions @action="onQuickAction" />
<MemberInfoBookingList
v-if="isLogin"
:items="bookingPreview"
@view-all="goBooking"
@item-tap="goBooking"
/>
<MemberInfoCheckInList
v-if="isLogin"
:items="checkIns"
@view-all="onCheckInViewAll"
@item-tap="onCheckInTap"
/>
<MemberInfoCouponPoints
v-if="isLogin"
:data="couponPoints"
@view-all="onCouponViewAll"
@use-coupon="onUseCoupon"
@redeem-points="onRedeemPoints"
/>
<MemberInfoSettings v-if="isLogin" @setting="onSetting" />
<MemberInfoLogout v-if="isLogin" @logout="handleLogout" />
</view>
</view>
</view>
</scroll-view>
</scroll-view>
</view>
<!-- 固定 TabBar -->
<view class="tabbar-fixed">
<TabBar />
<TabBar />
</view>
</view>
</template>
<script setup>
@@ -79,9 +72,7 @@ import MemberInfoMemberCard from '@/components/memberInfo/MemberInfoMemberCard.v
import MemberInfoQuickActions from '@/components/memberInfo/MemberInfoQuickActions.vue'
import MemberInfoBookingList from '@/components/memberInfo/MemberInfoBookingList.vue'
import MemberInfoCheckInList from '@/components/memberInfo/MemberInfoCheckInList.vue'
import MemberInfoBodyReport from '@/components/memberInfo/MemberInfoBodyReport.vue'
import MemberInfoCouponPoints from '@/components/memberInfo/MemberInfoCouponPoints.vue'
import MemberInfoReferral from '@/components/memberInfo/MemberInfoReferral.vue'
import MemberInfoSettings from '@/components/memberInfo/MemberInfoSettings.vue'
import MemberInfoLogout from '@/components/memberInfo/MemberInfoLogout.vue'
import TabBar from '@/components/TabBar.vue'
@@ -91,9 +82,7 @@ const stats = ref({})
const cardInfo = ref({})
const bookingPreview = ref([])
const checkIns = ref([])
const bodyReport = ref({})
const couponPoints = ref({})
const referral = ref({})
const loading = ref(false)
const hasActiveCard = ref(false)
const isLogin = ref(false)
@@ -213,12 +202,21 @@ function refreshFromStore() {
cardInfo.value = pageData.cardInfo
bookingPreview.value = pageData.bookingPreview
checkIns.value = pageData.checkIns
bodyReport.value = pageData.bodyReport
couponPoints.value = pageData.couponPoints
referral.value = pageData.referral
console.log('[memberInfo] refreshFromStore - userInfo.value:', JSON.stringify(userInfo.value))
}
function goUserInfo() {
navigateToPage(PAGE.USER_INFO)
}
function handleGuestLogin() {
console.log('[memberInfo] 用户点击登录区域')
uni.navigateTo({
url: '/pages/memberInfo/login'
})
}
function goMemberCard() {
navigateToPage(PAGE.MEMBER_CARD)
}
@@ -231,17 +229,6 @@ function goBooking() {
navigateToPage(PAGE.BOOKING)
}
function goUserInfo() {
navigateToPage(PAGE.USER_INFO)
}
function handleGuestLogin() {
console.log('[memberInfo] 用户点击登录区域')
uni.navigateTo({
url: '/pages/memberInfo/login'
})
}
function onRenewCard() {
uni.showModal({
title: '续费会员卡',
@@ -258,14 +245,8 @@ function onRenewCard() {
function onQuickAction(type) {
const routes = {
booking: PAGE.COURSE_LIST,
bodyTest: PAGE.BODY_TEST_HOME,
bodyReport: PAGE.BODY_TEST_HISTORY,
trainReport: PAGE.TRAIN_REPORT,
coupon: PAGE.COUPONS,
points: PAGE.POINTS,
referral: PAGE.REFERRAL,
course: PAGE.MY_COURSES
points: PAGE.POINTS
}
if (routes[type]) {
navigateToPage(routes[type])
@@ -284,18 +265,6 @@ function onCheckInTap(item) {
})
}
function onBodyReportHistory() {
navigateToPage(PAGE.BODY_TEST_HISTORY)
}
function onBodyReportView() {
const id = bodyReport.value?.recordId
const url = id
? `${PAGE.BODY_TEST_REPORT}?id=${id}`
: PAGE.BODY_TEST_HISTORY
navigateToPage(url)
}
function onCouponViewAll() {
navigateToPage(PAGE.COUPONS)
}
@@ -308,16 +277,10 @@ function onRedeemPoints() {
navigateToPage(PAGE.POINTS)
}
function onReferralRules() {
navigateToPage(PAGE.REFERRAL)
}
function onSetting(key) {
const labels = {
notify: '通知设置',
password: '修改密码',
privacy: '隐私政策',
nfc: 'NFC 门禁卡',
delete: '注销账户'
}
if (key === 'delete') {
@@ -361,9 +324,7 @@ function handleLogout() {
cardInfo.value = {}
bookingPreview.value = []
checkIns.value = []
bodyReport.value = {}
couponPoints.value = {}
referral.value = {}
hasActiveCard.value = false
refreshFromStore()
uni.showToast({ title: '已退出', icon: 'success' })
@@ -400,12 +361,29 @@ onShow(() => {
@import '@/common/style/memberInfo/member-info-quick-actions.css';
@import '@/common/style/memberInfo/member-info-booking-list.css';
@import '@/common/style/memberInfo/member-info-check-in-list.css';
@import '@/common/style/memberInfo/member-info-body-report.css';
@import '@/common/style/memberInfo/member-info-coupon-points.css';
@import '@/common/style/memberInfo/member-info-referral.css';
@import '@/common/style/memberInfo/member-info-settings.css';
@import '@/common/style/memberInfo/member-info-logout.css';
/* 页面布局:scroll-view + tabbar */
.member-info-page {
display: flex;
flex-direction: column;
height: 100vh;
overflow: hidden;
background: var(--gradient-sky);
}
.member-scroll-wrap {
flex: 1;
overflow: hidden;
}
.member-scroll {
height: 100%;
overflow-y: auto;
}
/* 固定 TabBar */
.tabbar-fixed {
position: fixed;
@@ -66,7 +66,7 @@
<view class="pc-payment__methods">
<view class="pc-payment__method pc-payment__method--selected">
<image src="https://gymfuture.oss-cn-chengdu.aliyuncs.com/static/images/alipay.png" mode="aspectFit" class="pc-payment__icon" />
<text class="pc-payment__name">支付宝支付</text>
<text class="pc-payment__name">{{ isWebEnv ? '扫码支付 (Web环境)' : 'App支付' }}</text>
<view class="pc-payment__check"></view>
</view>
</view>
@@ -88,6 +88,72 @@
</view>
</view>
</view>
<!-- 二维码支付对话框 (Web环境) -->
<view class="qr-payment-overlay" v-if="showQrPayment" @tap="closeQrPayment">
<view class="qr-payment-dialog" @tap.stop>
<view class="qr-payment-dialog__header">
<text class="qr-payment-dialog__title">{{ qrPaymentStatus === 'pending' ? '扫码支付' : (qrPaymentStatus === 'success' ? '支付成功' : '支付失败') }}</text>
<view class="qr-payment-dialog__close" @tap="closeQrPayment" v-if="qrPaymentStatus !== 'pending'">×</view>
</view>
<view class="qr-payment-dialog__body">
<!-- 待支付状态显示二维码 -->
<template v-if="qrPaymentStatus === 'pending'">
<view class="qr-payment-dialog__order">
<text class="qr-payment-dialog__label">订单信息</text>
<text class="qr-payment-dialog__value">{{ selectedCard?.cardName }} × 1</text>
</view>
<view class="qr-payment-dialog__amount">
<text class="qr-payment-dialog__label">支付金额</text>
<text class="qr-payment-dialog__money">¥{{ selectedCard?.price || 0 }}</text>
</view>
<view class="qr-payment-dialog__qrcode">
<image
v-if="qrCodeUrl"
:src="'https://api.qrserver.com/v1/create-qr-code?size=200x200&data=' + encodeURIComponent(qrCodeUrl)"
class="qr-payment-dialog__qrcode-img"
mode="aspectFit"
/>
<view v-else class="qr-payment-dialog__qrcode-loading">加载中...</view>
</view>
<view class="qr-payment-dialog__tips">
<text class="qr-payment-dialog__tip">请使用支付宝扫码支付</text>
<text class="qr-payment-dialog__tip qr-payment-dialog__tip--warn" v-if="isWebEnv"> 沙箱环境测试</text>
</view>
</template>
<!-- 支付成功状态 -->
<template v-else-if="qrPaymentStatus === 'success'">
<view class="qr-payment-dialog__result">
<text class="qr-payment-dialog__icon"></text>
<text class="qr-payment-dialog__result-text">支付成功</text>
</view>
</template>
<!-- 支付失败状态 -->
<template v-else>
<view class="qr-payment-dialog__result">
<text class="qr-payment-dialog__icon"></text>
<text class="qr-payment-dialog__result-text">支付失败</text>
</view>
</template>
</view>
<view class="qr-payment-dialog__footer">
<template v-if="qrPaymentStatus === 'pending'">
<view class="qr-payment-dialog__btn qr-payment-dialog__btn--secondary" @tap="closeQrPayment">
<text>取消支付</text>
</view>
</template>
<template v-else>
<view class="qr-payment-dialog__btn qr-payment-dialog__btn--primary" @tap="closeQrPayment">
<text>确定</text>
</view>
</template>
</view>
</view>
</view>
</view>
</template>
@@ -95,9 +161,27 @@
import { ref, onMounted, onUnmounted } from 'vue'
import { onBackPress } from '@dcloudio/uni-app'
import MemberInfoSubNav from '@/components/memberInfo/MemberInfoSubNav.vue'
import { purchaseMemberCard, createPayment, getPaymentStatus } from '@/api/main.js'
import { purchaseMemberCard, createPayment, createQrCodePayment, getPaymentStatus } from '@/api/main.js'
import { loadMemberStore } from '@/common/memberInfo/store.js'
// ==================== Web环境检测 ====================
// #ifdef H5
const isWebEnv = typeof navigator !== 'undefined' && !typeof plus !== 'undefined'
// #endif
// #ifndef H5
const isWebEnv = false
// #endif
// ==================== 二维码支付相关状态 ====================
const showQrPayment = ref(false)
const qrPaymentStatus = ref('pending') // pending | success | fail
const qrCodeUrl = ref('')
let qrPaymentResolve = null
let qrPaymentReject = null
let currentQrOrderId = null
let qrPollingTimer = null
let isQrPolling = false
const cardTypes = ref([
{ id: 1, cardName: '月卡', cardType: 'DURATION', validityDays: 30, price: 1, originalPrice: 399 },
{ id: 2, cardName: '季卡', cardType: 'DURATION', validityDays: 90, price: 1, originalPrice: 999 },
@@ -265,6 +349,103 @@ function startPolling(orderId) {
})
}
// ==================== Web环境扫码支付 ====================
function openQrPayment(qrCode, orderId) {
qrCodeUrl.value = qrCode
currentQrOrderId = orderId
qrPaymentStatus.value = 'pending'
showQrPayment.value = true
// 开始轮询支付状态
startQrPolling(orderId)
}
function closeQrPayment() {
showQrPayment.value = false
stopQrPolling()
if (qrPaymentStatus.value === 'pending' && qrPaymentReject) {
qrPaymentReject(new Error('用户取消支付'))
}
qrPaymentResolve = null
qrPaymentReject = null
currentQrOrderId = null
qrCodeUrl.value = ''
}
// ==================== 二维码支付轮询 ====================
function startQrPolling(orderId) {
if (isQrPolling) return
isQrPolling = true
let pollCount = 0
const maxRetry = 300 // 5分钟超时 (300秒)
function doQuery() {
if (!showQrPayment.value || qrPaymentStatus.value !== 'pending') return
pollCount++
getPaymentStatus(orderId)
.then(res => {
if (res.code === 200 && res.data) {
const status = res.data.status || res.data.payStatus
console.log(`[QrPoll] 第 ${pollCount} 次查询,状态:`, status)
if (status === 'SUCCESS') {
qrPaymentStatus.value = 'success'
stopQrPolling()
if (qrPaymentResolve) {
qrPaymentResolve(true)
}
return
} else if (status === 'FAIL' || status === 'CLOSED') {
qrPaymentStatus.value = 'fail'
stopQrPolling()
if (qrPaymentReject) {
qrPaymentReject(new Error('支付失败'))
}
return
}
}
// 继续轮询
if (pollCount < maxRetry && showQrPayment.value && qrPaymentStatus.value === 'pending') {
qrPollingTimer = setTimeout(doQuery, 1000)
} else if (qrPaymentStatus.value === 'pending') {
qrPaymentStatus.value = 'fail'
stopQrPolling()
if (qrPaymentReject) {
qrPaymentReject(new Error('支付超时'))
}
}
})
.catch(err => {
console.error('[QrPoll] 查询异常:', err)
if (pollCount < maxRetry && showQrPayment.value && qrPaymentStatus.value === 'pending') {
qrPollingTimer = setTimeout(doQuery, 1000)
} else if (qrPaymentStatus.value === 'pending') {
qrPaymentStatus.value = 'fail'
stopQrPolling()
if (qrPaymentReject) {
qrPaymentReject(new Error('支付查询失败'))
}
}
})
}
// 延迟 2 秒开始轮询
qrPollingTimer = setTimeout(doQuery, 2000)
}
function stopQrPolling() {
isQrPolling = false
if (qrPollingTimer) {
clearTimeout(qrPollingTimer)
qrPollingTimer = null
}
}
// ==================== 核心购买逻辑 ====================
async function handlePurchase() {
if (!selectedCard.value) {
@@ -278,72 +459,114 @@ async function handlePurchase() {
try {
const store = loadMemberStore()
const memberId = store.memberProfile?.id || store.profile?.id
// if (!memberId) {
// uni.showToast({ title: '请先登录', icon: 'none' })
// loading.value = false
// return
// }
// 金额转换:元 -> 分
const transAmt = String(Math.round(selectedCard.value.price * 100))
const cardName = selectedCard.value.cardName
// 1. 创建支付订单
uni.showLoading({ title: '创建订单中...' })
const payRes = await createPayment({
memberId: memberId,
orderType: 'MEMBER_CARD',
goodsDesc: `购买${cardName}`,
transAmt: transAmt,
tradeType: TRADE_TYPE,
remark: `会员卡类型ID:${selectedCard.value.id}`
})
// 根据环境选择支付方式
if (isWebEnv) {
// ==================== Web环境:扫码支付 ====================
uni.showLoading({ title: '创建订单...' })
if (payRes.code !== 200) {
const payRes = await createQrCodePayment({
memberId: memberId,
orderType: 'MEMBER_CARD',
goodsDesc: `购买${cardName}`,
transAmt: transAmt,
tradeType: 'QRCODE',
remark: `会员卡类型ID:${selectedCard.value.id}`
})
if (payRes.code !== 200) {
uni.hideLoading()
uni.showToast({ title: payRes.message || '创建支付订单失败', icon: 'none' })
loading.value = false
return
}
const payData = payRes.data
const orderId = payData.orderId
const qrCode = payData.qrCode
if (!qrCode) {
uni.hideLoading()
uni.showToast({ title: '获取二维码失败', icon: 'none' })
loading.value = false
return
}
// 显示二维码支付对话框
uni.hideLoading()
uni.showToast({ title: payRes.message || '创建支付订单失败', icon: 'none' })
loading.value = false
return
await new Promise((resolve, reject) => {
qrPaymentResolve = resolve
qrPaymentReject = reject
openQrPayment(qrCode, orderId)
})
// 支付成功后继续购买会员卡
} else {
// ==================== App环境:唤起支付宝App ====================
uni.showLoading({ title: '创建订单...' })
const payRes = await createPayment({
memberId: memberId,
orderType: 'MEMBER_CARD',
goodsDesc: `购买${cardName}`,
transAmt: transAmt,
tradeType: TRADE_TYPE,
remark: `会员卡类型ID:${selectedCard.value.id}`
})
if (payRes.code !== 200) {
uni.hideLoading()
uni.showToast({ title: payRes.message || '创建支付订单失败', icon: 'none' })
loading.value = false
return
}
const payData = payRes.data
const orderId = payData.orderId
const payUrl = payData.payUrl || payData.payInfo || payData.h5PayUrl
if (!payUrl) {
uni.hideLoading()
uni.showToast({ title: '获取支付链接失败', icon: 'none' })
loading.value = false
return
}
// 唤起支付宝
uni.hideLoading()
uni.showLoading({ title: '正在唤起支付宝...' })
try {
await invokeAlipayApp(payUrl)
} catch (err) {
uni.hideLoading()
uni.showToast({ title: err.message || '唤起支付宝失败', icon: 'none' })
loading.value = false
return
}
// 轮询支付状态
uni.showLoading({ title: '等待支付结果...' })
await startPolling(orderId)
}
const payData = payRes.data
const orderId = payData.orderId
// 2. 获取支付链接
const payUrl = payData.payUrl || payData.payInfo || payData.h5PayUrl
if (!payUrl) {
uni.hideLoading()
uni.showToast({ title: '获取支付链接失败', icon: 'none' })
loading.value = false
return
}
// 3. 唤起支付宝 App
uni.hideLoading()
uni.showLoading({ title: '正在唤起支付宝...' })
try {
await invokeAlipayApp(payUrl)
} catch (err) {
uni.hideLoading()
uni.showToast({ title: '唤起支付宝失败,请确认已安装支付宝', icon: 'none' })
loading.value = false
return
}
// 4. 轮询支付状态
uni.showLoading({ title: '等待支付结果...' })
await startPolling(orderId)
// 5. 支付成功,购买会员卡
// 支付成功,购买会员卡
uni.hideLoading()
const memberRes = await purchaseMemberCard({
memberId: memberId,
memberCardId: selectedCard.value.id,
sourceOrderId: orderId
sourceOrderId: currentQrOrderId || currentQrOrderId
})
if (memberRes.code === 200) {
// 关闭二维码对话框
if (showQrPayment.value) {
showQrPayment.value = false
}
uni.showToast({ title: '购买成功 🎉', icon: 'success' })
setTimeout(() => {
uni.redirectTo({
@@ -377,6 +600,7 @@ onUnmounted(() => {
pollingTimer.value = null
}
isPolling.value = false
stopQrPolling()
if (typeof plus !== 'undefined') {
plus.globalEvent.removeEventListener('resume', () => {})
}
@@ -691,4 +915,157 @@ onUnmounted(() => {
font-weight: 600;
color: #FFFFFF;
}
// ==================== 模拟支付对话框 ====================
.mock-payment-overlay {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.5);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
}
.qr-payment-dialog {
width: 320px;
background: #FFFFFF;
border-radius: 16px;
overflow: hidden;
}
.qr-payment-dialog__header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 20px 24px;
border-bottom: 1px solid #E2E8F0;
}
.qr-payment-dialog__title {
font-size: 18px;
font-weight: 600;
color: #1A202C;
}
.qr-payment-dialog__close {
width: 32px;
height: 32px;
display: flex;
align-items: center;
justify-content: center;
font-size: 24px;
color: #A0AEC0;
}
.qr-payment-dialog__body {
padding: 24px;
}
.qr-payment-dialog__order,
.qr-payment-dialog__amount {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 12px;
}
.qr-payment-dialog__label {
font-size: 14px;
color: #718096;
}
.qr-payment-dialog__value {
font-size: 14px;
color: #2D3748;
}
.qr-payment-dialog__money {
font-size: 24px;
font-weight: 700;
color: #E53E3E;
}
.qr-payment-dialog__qrcode {
display: flex;
justify-content: center;
align-items: center;
padding: 20px 0;
background: #F7FAFC;
border-radius: 8px;
margin: 16px 0;
}
.qr-payment-dialog__qrcode-img {
width: 200px;
height: 200px;
}
.qr-payment-dialog__qrcode-loading {
font-size: 14px;
color: #A0AEC0;
padding: 80px 0;
}
.qr-payment-dialog__tips {
display: flex;
flex-direction: column;
align-items: center;
gap: 4px;
}
.qr-payment-dialog__tip {
font-size: 12px;
color: #718096;
&--warn {
color: #ED8936;
}
}
.qr-payment-dialog__result {
display: flex;
flex-direction: column;
align-items: center;
padding: 20px 0;
}
.qr-payment-dialog__icon {
font-size: 48px;
margin-bottom: 16px;
}
.qr-payment-dialog__result-text {
font-size: 16px;
font-weight: 600;
color: #2D3748;
}
.qr-payment-dialog__footer {
display: flex;
gap: 12px;
padding: 0 24px 24px;
}
.qr-payment-dialog__btn {
flex: 1;
padding: 14px 0;
border-radius: 8px;
text-align: center;
font-size: 16px;
font-weight: 500;
&--primary {
background: #1677FF;
color: #FFFFFF;
}
&--secondary {
background: #E2E8F0;
color: #4A5568;
}
}
</style>
@@ -164,6 +164,8 @@ onMounted(() => {
}
.courses-list {
display: flex;
flex-direction: column;
padding: 0 24rpx;
}
File diff suppressed because it is too large Load Diff
-141
View File
@@ -1,141 +0,0 @@
<template>
<!-- 滚动内容区域 -->
<scroll-view scroll-y class="scroll-container">
<view class="tab-page">
<view class="tab-page__header">
<text class="tab-page__title">训练</text>
<text class="tab-page__subtitle">记录每一次进步</text>
</view>
<view class="train-cards">
<view class="train-card" hover-class="train-card--hover" @tap="goTrainReport">
<text class="train-card__title">训练报告</text>
<text class="train-card__desc">查看本周/本月运动数据与趋势</text>
</view>
<view class="train-card" hover-class="train-card--hover" @tap="goBodyTest">
<text class="train-card__title">智能体测</text>
<text class="train-card__desc">连接设备获取专业体测报告</text>
</view>
<view class="train-card" hover-class="train-card--hover" @tap="goBodyHistory">
<text class="train-card__title">体测报告</text>
<text class="train-card__desc">历史记录与对比分析</text>
</view>
<view class="train-card" hover-class="train-card--hover" @tap="goCheckIn">
<text class="train-card__title">签到记录</text>
<text class="train-card__desc">到店打卡与训练频次</text>
</view>
</view>
<view class="bottom-placeholder"></view>
</view>
</scroll-view>
<!-- 固定 TabBar -->
<view class="tabbar-fixed">
<TabBar :active="2" />
</view>
</template>
<script setup>
import TabBar from '@/components/TabBar.vue'
import { PAGE, navigateToPage } from '@/common/constants/routes.js'
function goTrainReport() {
navigateToPage(PAGE.TRAIN_REPORT)
}
function goBodyTest() {
navigateToPage(PAGE.BODY_TEST_HOME)
}
function goBodyHistory() {
navigateToPage(PAGE.BODY_TEST_HISTORY)
}
function goCheckIn() {
navigateToPage(PAGE.CHECK_IN_HISTORY)
}
</script>
<style lang="scss" scoped>
.tab-page {
min-height: 100vh;
padding-bottom: 160rpx;
position: relative;
z-index: 2;
}
.tab-page__header {
padding: 48rpx 32rpx 16rpx;
}
.tab-page__title {
display: block;
font-size: 40rpx;
font-weight: $font-weight-bold;
color: $text-dark;
}
.tab-page__subtitle {
display: block;
margin-top: 8rpx;
font-size: 24rpx;
color: $text-muted;
}
.train-cards {
display: flex;
flex-direction: column;
gap: 20rpx;
padding: 24rpx 32rpx;
}
.train-card {
padding: 28rpx 32rpx;
border-radius: $radius-md;
background: $bg-white;
box-shadow: $shadow-sm;
border: 1px solid $border-light;
transition: all 0.2s ease;
}
.train-card:active {
transform: scale(0.98);
}
.train-card__title {
display: block;
font-size: 30rpx;
font-weight: $font-weight-bold;
color: $text-dark;
}
.train-card__desc {
display: block;
margin-top: 8rpx;
font-size: 24rpx;
color: $text-muted;
}
.bottom-placeholder {
height: 40rpx;
}
/* 滚动容器 */
.scroll-container {
position: relative;
z-index: 1;
height: 100vh;
width: 100%;
}
/* 固定 TabBar */
.tabbar-fixed {
position: fixed;
bottom: 0;
left: 0;
right: 0;
z-index: 1000;
background-color: transparent;
}
</style>
+2 -2
View File
@@ -1,5 +1,5 @@
// const BASE_URL = '/api'
const BASE_URL = 'http://192.168.43.89:8084/api'
const BASE_URL = '/api'
// const BASE_URL = 'http://localhost:8084'
// 缓存相关常量
const CACHE_PREFIX = 'API_CACHE_'
+1 -1
View File
@@ -17,7 +17,7 @@ export default defineConfig({
server: {
proxy: {
'/api': {
target: 'http://192.168.43.89:8084',
target: 'http://localhost:8084',
changeOrigin: true,
secure: true,
bypass: function(req, res, proxyOptions) {