update

src/views/activity/activityPoster.vue

@@ -26,16 +26,16 @@
       </div>
       <div class="scroll-wrapper">
         <van-list
-v-model:loading="listLoading"
-:finished="listFinished"
-finished-text="没有更多活动了"
-                  @load="onLoadMore">
+          v-model:loading="listLoading"
+          :finished="listFinished"
+          finished-text="没有更多活动了"
+          @load="onLoadMore">
           <div
-v-for="item in activityList"
-:key="item.id"
-class="activity-item"
-               :class="{ active: selectedActivity?.id === item.id }"
-@click="onSelectActivity(item)">
+            v-for="item in activityList"
+            :key="item.id"
+            class="activity-item"
+            :class="{ active: selectedActivity?.id === item.id }"
+            @click="onSelectActivity(item)">
             <div class="activity-title">{{ item.title }}</div>
             <div class="activity-time">{{ item.Subtitle }} | {{ formatDateToShow(item.end_time) }}</div>
           </div>
@@ -47,10 +47,13 @@ class="activity-item"
     <div ref="posterRef" class="poster-wrapper hidden-poster">
       <div class="poster-card">
         <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-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 class="sponsor-name">
               <p class="name">主办：{{ sponsorName }}</p>
@@ -84,7 +87,7 @@ class="activity-item"
         <van-loading v-if="isGenerating" size="20px" color="#fff" />
         <span v-else>✨ 生成海报</span>
       </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>
 
     <!-- 生成预览区域 -->
@@ -131,7 +134,29 @@ export default {
     this.getData()
     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: {
+    // 格式化标题：切割 · 符号，取最后一个
+    // 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 中的函数
     async getData() {
       console.log('33455')
@@ -364,11 +389,11 @@ img {
 .poster-title {
   position: absolute;
   left: 0;
-  top: 262px;
+  top: 130px;
   width: 100%;
   letter-spacing: 4px;
-  font-size: 20px;
-  font-weight: 400;
+  font-size: 32px;
+  font-weight: 900;
   display: flex;
   justify-content: center;
   padding: 0;
@@ -387,7 +412,32 @@ img {
   overflow: hidden;
   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 {
   position: absolute;
   left: 0;
@@ -591,15 +641,16 @@ img {
   flex-shrink: 0;
   width: 16px;
   height: 16px;
-  .vant-select-icon{
-    width: 16px;
-    height: 16px;
-  }
+}
+
+.selector-arrow .van-icon {
+  width: 16px;
+  height: 16px;
 }
 
 /* 弹窗样式 */
 .activity-popup {
-  height: 70vh;
+  height: 85vh;
   display: flex;
   flex-direction: column;
   border-radius: 20px 20px 0 0;
@@ -638,7 +689,7 @@ img {
 .scroll-wrapper {
   flex: 1;
   overflow-y: auto;
-  margin-bottom: 100px;
+  padding-bottom: 20px;
 }
 
 .activity-item {