Toggle navigation
Toggle navigation
This project
Loading...
Sign in
Hooke
/
mlaj
Go to a project
Toggle navigation
Toggle navigation pinning
Projects
Groups
Snippets
Help
Project
Activity
Repository
Pipelines
Graphs
Issues
0
Merge Requests
0
Wiki
Snippets
Network
Create a new issue
Builds
Commits
Issue Boards
Authored by
hookehuyr
2025-10-13 11:40:49 +0800
Browse Files
Options
Browse Files
Download
Email Patches
Plain Diff
Commit
0fdaf573179c5a8f386d5bb7c8711ca535fc8234
0fdaf573
1 parent
2826e2fd
feat(首页): 在课程卡片上添加已购标识
为已购买的课程添加视觉标识,方便用户快速识别
Hide whitespace changes
Inline
Side-by-side
Showing
1 changed file
with
19 additions
and
3 deletions
src/views/HomePage.vue
src/views/HomePage.vue
View file @
0fdaf57
<!--
* @Date: 2025-03-20 19:55:21
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-
09-25 11:54:1
3
* @LastEditTime: 2025-
10-13 11:39:4
3
* @FilePath: /mlaj/src/views/HomePage.vue
* @Description: 美乐爱觉教育首页组件
*
...
...
@@ -199,6 +199,14 @@
:alt="course.title"
class="w-full h-full object-cover"
/>
<!-- 已购标识 -->
<div
v-if="course.is_buy"
class="absolute top-0 left-0 bg-orange-500 text-white text-xs px-2 py-1 rounded-br-lg font-medium"
style="background-color: rgba(249, 115, 22, 0.85)"
>
已购
</div>
<div class="absolute inset-0 bg-gradient-to-b from-transparent via-black/20 to-black/60 flex flex-col justify-end p-4">
<div class="bg-amber-500/90 text-white px-2 py-1 rounded-full text-xs font-medium inline-block w-fit mb-1">
{{ course.category }}
...
...
@@ -300,12 +308,20 @@
class="p-3 rounded-xl"
>
<div class="flex flex-col h-full" @click="goToCourseDetail(item)">
<div class="h-28 mb-2 rounded-lg overflow-hidden">
<div class="h-28 mb-2 rounded-lg overflow-hidden
relative
">
<img
:src="item.cover || 'https://cdn.ipadbiz.cn/mlaj/images/default_block.png'"
:alt="item.title"
class="w-full h-full object-cover"
/>
<!-- 已购标识 -->
<div
v-if="item.is_buy"
class="absolute top-0 left-0 bg-orange-500 text-white text-xs px-2 py-1 rounded-br-lg font-medium"
style="background-color: rgba(249, 115, 22, 0.85)"
>
已购
</div>
</div>
<h4 class="font-medium text-sm mb-1 line-clamp-1">{{ item.title }}</h4>
<!--<p class="text-xs text-gray-500 flex items-center mt-auto">
...
...
@@ -521,7 +537,7 @@ import ActivityCard from '@/components/ui/ActivityCard.vue'
import SummerCampCard from '@/components/ui/SummerCampCard.vue'
import VideoPlayer from '@/components/ui/VideoPlayer.vue'
// 导入模拟数据和工具函数
//
TODO:
导入模拟数据和工具函数
import { liveStreams, activities } from '@/utils/mockData'
import { useTitle } from '@vueuse/core'
import { useAuth } from '@/contexts/auth'
...
...
Please
register
or
login
to post a comment