Toggle navigation
Toggle navigation
This project
Loading...
Sign in
Hooke
/
lls_program
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
2026-05-22 09:51:13 +0800
Browse Files
Options
Browse Files
Download
Email Patches
Plain Diff
Commit
fc3728bd874a9860cd9224c2c90031aabdc6caad
fc3728bd
1 parent
1e4463d5
refactor(CheckinMap): 优化签到卡片布局与样式
重构卡片模板结构,将日期栏与进入按钮分组为底部模块;修复封面图片显示问题;统一使用flex布局优化整体排版
Hide whitespace changes
Inline
Side-by-side
Showing
1 changed file
with
21 additions
and
7 deletions
src/pages/CheckinMap/index.vue
src/pages/CheckinMap/index.vue
View file @
fc3728b
...
...
@@ -18,12 +18,14 @@
<!-- 卡片内容 -->
<view class="card-content">
<text class="card-title">{{ item.title }}</text>
<view class="card-time-wrapper">
<text class="card-time-label">活动日期</text>
<text class="card-time">{{ item.timeRange }}</text>
</view>
<view class="enter-btn" @tap.stop="handleEnter(item)">
<text class="enter-btn-text">立即进入</text>
<view class="card-bottom-module">
<view class="card-time-wrapper">
<text class="card-time-label">活动日期</text>
<text class="card-time">{{ item.timeRange }}</text>
</view>
<view class="enter-btn" @tap.stop="handleEnter(item)">
<text class="enter-btn-text">立即进入</text>
</view>
</view>
</view>
</view>
...
...
@@ -178,6 +180,8 @@ useLoad(() => {
}
.map-card {
display: flex;
flex-direction: column;
background-color: #ffffff;
border-radius: 16px;
overflow: hidden;
...
...
@@ -197,7 +201,9 @@ useLoad(() => {
.cover-image {
width: 100%;
/* 高度由 mode="widthFix" 自动控制,保持宽高比 */
height: 100%;
display: block;
object-fit: cover;
}
.card-content {
...
...
@@ -205,6 +211,7 @@ useLoad(() => {
display: flex;
flex-direction: column;
gap: 12px;
flex: 1;
}
.card-title {
...
...
@@ -218,6 +225,13 @@ useLoad(() => {
-webkit-box-orient: vertical;
}
.card-bottom-module {
margin-top: auto;
display: flex;
flex-direction: column;
gap: 12px;
}
.card-time-wrapper {
display: flex;
flex-direction: column;
...
...
Please
register
or
login
to post a comment