修改主题色
This commit is contained in:
@@ -79,6 +79,9 @@
|
||||
import { ref, onMounted } from 'vue'
|
||||
import { getGroupCoursePage } from '@/api/main.js'
|
||||
|
||||
// 测试开关:设置为 true 时使用假数据,false 时使用真实API数据
|
||||
const USE_MOCK_DATA = true
|
||||
|
||||
// 推荐课程数据列表
|
||||
const courses = ref([])
|
||||
|
||||
@@ -134,6 +137,12 @@ const getImageUrl = (coverImage) => {
|
||||
|
||||
// 获取推荐课程
|
||||
const fetchRecommendCourses = async () => {
|
||||
// 如果测试开关打开,直接使用假数据
|
||||
if (USE_MOCK_DATA) {
|
||||
useFallbackData()
|
||||
return
|
||||
}
|
||||
|
||||
try {
|
||||
const res = await getGroupCoursePage({
|
||||
page: 0, size: 5, sort: 'current_members', order: 'desc'
|
||||
@@ -151,11 +160,11 @@ const fetchRecommendCourses = async () => {
|
||||
|
||||
const useFallbackData = () => {
|
||||
const fallbackContent = [
|
||||
{ id: "3", courseName: "燃脂搏击", courseType: "2", startTime: "2026-06-10T18:30:00", endTime: "2026-06-10T19:30:00", maxMembers: 20, currentMembers: 20, status: "0", coverImage: "/images/kickboxing.jpg", description: "高强度间歇训练" },
|
||||
{ id: "2", courseName: "清晨流瑜伽", courseType: "1", startTime: "2026-06-12T09:00:00", endTime: "2026-06-12T10:30:00", maxMembers: 15, currentMembers: 5, status: "0", coverImage: "/images/yoga_flow.jpg", description: "流畅体式" },
|
||||
{ id: "4", courseName: "哈他瑜伽", courseType: "1", startTime: "2026-06-01T15:20:00", endTime: "2026-06-01T16:50:00", maxMembers: 12, currentMembers: 3, status: "0", coverImage: "/images/hatha_yoga.jpg", description: "基础瑜伽" },
|
||||
{ id: "6", courseName: "蜜桃臀塑造", courseType: "3", startTime: "2026-05-30T19:00:00", endTime: "2026-05-30T20:00:00", maxMembers: 10, currentMembers: 8, status: "2", coverImage: "/images/glute.jpg", description: "臀部训练" },
|
||||
{ id: "7", courseName: "午间冥想放松", courseType: "1", startTime: "2026-05-31T12:00:00", endTime: "2026-05-31T13:00:00", maxMembers: 15, currentMembers: 6, status: "2", coverImage: "/images/meditation_noon.jpg", description: "冥想" }
|
||||
{ id: "3", courseName: "燃脂搏击", courseType: "2", startTime: "2026-06-10T18:30:00", endTime: "2026-06-10T19:30:00", maxMembers: 20, currentMembers: 20, status: "0", coverImage: "https://picsum.photos/id/100/800/600", description: "高强度间歇训练" },
|
||||
{ id: "2", courseName: "清晨流瑜伽", courseType: "1", startTime: "2026-06-12T09:00:00", endTime: "2026-06-12T10:30:00", maxMembers: 15, currentMembers: 5, status: "0", coverImage: "https://picsum.photos/id/101/800/600", description: "流畅体式" },
|
||||
{ id: "4", courseName: "哈他瑜伽", courseType: "1", startTime: "2026-06-01T15:20:00", endTime: "2026-06-01T16:50:00", maxMembers: 12, currentMembers: 3, status: "0", coverImage: "https://picsum.photos/id/102/800/600", description: "基础瑜伽" },
|
||||
{ id: "6", courseName: "蜜桃臀塑造", courseType: "3", startTime: "2026-05-30T19:00:00", endTime: "2026-05-30T20:00:00", maxMembers: 10, currentMembers: 8, status: "2", coverImage: "https://picsum.photos/id/103/800/600", description: "臀部训练" },
|
||||
{ id: "7", courseName: "午间冥想放松", courseType: "1", startTime: "2026-05-31T12:00:00", endTime: "2026-05-31T13:00:00", maxMembers: 15, currentMembers: 6, status: "2", coverImage: "https://picsum.photos/id/104/800/600", description: "冥想" }
|
||||
]
|
||||
courses.value = fallbackContent.map(course => ({
|
||||
id: course.id, image: getImageUrl(course.coverImage), tag: getTag(course),
|
||||
@@ -200,7 +209,7 @@ onMounted(() => { fetchRecommendCourses() })
|
||||
align-items: center;
|
||||
gap: 4rpx;
|
||||
font-size: 26rpx;
|
||||
color: #8AABBB;
|
||||
color: var(--tabbar-text-inactive);
|
||||
}
|
||||
|
||||
.arrow {
|
||||
@@ -223,7 +232,7 @@ onMounted(() => { fetchRecommendCourses() })
|
||||
-webkit-backdrop-filter: blur(16px);
|
||||
border-radius: 24rpx;
|
||||
overflow: hidden;
|
||||
box-shadow: 0 8rpx 28rpx rgba(120, 185, 215, 0.18);
|
||||
box-shadow: 0 8rpx 28rpx var(--shadow-blue-light);
|
||||
border: 1rpx solid rgba(255, 255, 255, 0.6);
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
@@ -335,7 +344,7 @@ onMounted(() => { fetchRecommendCourses() })
|
||||
align-items: center;
|
||||
gap: 6rpx;
|
||||
font-size: 22rpx;
|
||||
color: #8AABBB;
|
||||
color: var(--tabbar-text-inactive);
|
||||
}
|
||||
|
||||
.fire-icon {
|
||||
@@ -350,12 +359,12 @@ onMounted(() => { fetchRecommendCourses() })
|
||||
|
||||
.join-btn {
|
||||
padding: 12rpx 28rpx;
|
||||
background: linear-gradient(135deg, #7AB5CC 0%, #9CCFDF 100%);
|
||||
background: rgba(130, 220, 130, 0.9);
|
||||
border: none;
|
||||
border-radius: 9999rpx;
|
||||
font-size: 22rpx;
|
||||
font-weight: 600;
|
||||
color: #ffffff;
|
||||
box-shadow: 0 6rpx 16rpx rgba(122, 181, 204, 0.35);
|
||||
box-shadow: 0 6rpx 16rpx rgba(130, 220, 130, 0.35);
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user