This commit is contained in:
mac·ufutx 2026-04-15 18:27:47 +08:00
parent fd0993132c
commit 9fffc5c847

View File

@ -26,16 +26,16 @@
</div> </div>
<div class="scroll-wrapper"> <div class="scroll-wrapper">
<van-list <van-list
v-model:loading="listLoading" v-model:loading="listLoading"
:finished="listFinished" :finished="listFinished"
finished-text="没有更多活动了" finished-text="没有更多活动了"
@load="onLoadMore"> @load="onLoadMore">
<div <div
v-for="item in activityList" v-for="item in activityList"
:key="item.id" :key="item.id"
class="activity-item" class="activity-item"
:class="{ active: selectedActivity?.id === item.id }" :class="{ active: selectedActivity?.id === item.id }"
@click="onSelectActivity(item)"> @click="onSelectActivity(item)">
<div class="activity-title">{{ item.title }}</div> <div class="activity-title">{{ item.title }}</div>
<div class="activity-time">{{ item.Subtitle }} | {{ formatDateToShow(item.end_time) }}</div> <div class="activity-time">{{ item.Subtitle }} | {{ formatDateToShow(item.end_time) }}</div>
</div> </div>
@ -47,10 +47,13 @@ class="activity-item"
<div ref="posterRef" class="poster-wrapper hidden-poster"> <div ref="posterRef" class="poster-wrapper hidden-poster">
<div class="poster-card"> <div class="poster-card">
<div class="poster-content"> <div class="poster-content">
<img src="https://images.health.ufutx.com/202604/13/8fa1b3080a60f97ef3f75e1370a6217c.jpeg" alt="海报背景图" /> <img src="https://images.health.ufutx.com/202604/15/a90d31b444dd5f8f974b502b42bd4872.jpeg" alt="海报背景图" />
<div class="poster-content-wrapper"> <div class="poster-content-wrapper">
<div class="poster-title"> <div class="poster-title">
<p class="poster-title-text">{{ selectedActivity?.Subtitle || '河南·襄城站' }}</p> <p class="poster-title-text">{{ formattedTitle }}</p>
</div>
<div class="poster-subtitle">
<p class="poster-subtitle-text">{{ selectedActivity?.Subtitle || '河南·襄城站' }}</p>
</div> </div>
<div class="sponsor-name"> <div class="sponsor-name">
<p class="name">主办{{ sponsorName }}</p> <p class="name">主办{{ sponsorName }}</p>
@ -84,7 +87,7 @@ class="activity-item"
<van-loading v-if="isGenerating" size="20px" color="#fff" /> <van-loading v-if="isGenerating" size="20px" color="#fff" />
<span v-else> 生成海报</span> <span v-else> 生成海报</span>
</button> </button>
<button v-if="posterImg && !isWeChatEnv" class="btn btn-secondary" @click="downloadPoster"> 📥 下载海报</button> <button v-if="posterImg && !isWeChatEnv" class="btn btn-secondary" @click="downloadPoster">📥 下载海报</button>
</div> </div>
<!-- 生成预览区域 --> <!-- 生成预览区域 -->
@ -131,7 +134,29 @@ export default {
this.getData() this.getData()
console.log('33') console.log('33')
}, },
computed: {
formattedTitle() {
if (!this.selectedActivity?.title) return ''
const parts = this.selectedActivity.title.split('•')
console.log('computed parts:', parts)
const lastPart = parts[parts.length - 1].trim()
console.log('computed formattedTitle:', lastPart)
return lastPart
}
},
methods: { methods: {
// ·
// formatTitle(title) {
// if (!title) return ''
// // ·
// debugger
// const parts = title.split('·')
// console.log(parts)
// debugger
// const lastPart = parts[parts.length - 1].trim()
// return lastPart
// },
// script setup // script setup
async getData() { async getData() {
console.log('33455') console.log('33455')
@ -364,11 +389,11 @@ img {
.poster-title { .poster-title {
position: absolute; position: absolute;
left: 0; left: 0;
top: 262px; top: 130px;
width: 100%; width: 100%;
letter-spacing: 4px; letter-spacing: 4px;
font-size: 20px; font-size: 32px;
font-weight: 400; font-weight: 900;
display: flex; display: flex;
justify-content: center; justify-content: center;
padding: 0; padding: 0;
@ -387,7 +412,32 @@ img {
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
} }
.poster-subtitle {
position: absolute;
left: 0;
top: 262px;
width: 100%;
letter-spacing: 4px;
font-size: 20px;
font-weight: 400;
display: flex;
justify-content: center;
padding: 0;
}
.poster-subtitle .poster-subtitle-text {
text-align: center;
width: 300px;
color: #0d2f73;
line-height: 1.6;
padding: 2px 0;
margin: 0;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}
.sponsor-name { .sponsor-name {
position: absolute; position: absolute;
left: 0; left: 0;
@ -591,15 +641,16 @@ img {
flex-shrink: 0; flex-shrink: 0;
width: 16px; width: 16px;
height: 16px; height: 16px;
.vant-select-icon{ }
width: 16px;
height: 16px; .selector-arrow .van-icon {
} width: 16px;
height: 16px;
} }
/* 弹窗样式 */ /* 弹窗样式 */
.activity-popup { .activity-popup {
height: 70vh; height: 85vh;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
border-radius: 20px 20px 0 0; border-radius: 20px 20px 0 0;
@ -638,7 +689,7 @@ img {
.scroll-wrapper { .scroll-wrapper {
flex: 1; flex: 1;
overflow-y: auto; overflow-y: auto;
margin-bottom: 100px; padding-bottom: 20px;
} }
.activity-item { .activity-item {