feat(StudentInfo): 添加查看更多按钮并调整学生信息显示
添加查看更多按钮以跳转到学生列表页面 将学生姓名和字号显示位置互换
Showing
1 changed file
with
26 additions
and
3 deletions
| 1 | <!-- | 1 | <!-- |
| 2 | * @Date: 2025-11-10 18:12:23 | 2 | * @Date: 2025-11-10 18:12:23 |
| 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com | 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com |
| 4 | - * @LastEditTime: 2025-11-12 15:14:14 | 4 | + * @LastEditTime: 2025-11-12 17:07:59 |
| 5 | * @FilePath: /stdj_h5/src/views/StudentInfo.vue | 5 | * @FilePath: /stdj_h5/src/views/StudentInfo.vue |
| 6 | * @Description: 戒子详情页 | 6 | * @Description: 戒子详情页 |
| 7 | --> | 7 | --> |
| ... | @@ -11,8 +11,8 @@ | ... | @@ -11,8 +11,8 @@ |
| 11 | <div class="item-card"> | 11 | <div class="item-card"> |
| 12 | <img :src="student_info.src" :alt="student_info.title" class="item-image" /> | 12 | <img :src="student_info.src" :alt="student_info.title" class="item-image" /> |
| 13 | <div class="item-content"> | 13 | <div class="item-content"> |
| 14 | - <div class="item-role">{{ student_info.role }}</div> | 14 | + <div class="item-role">{{ student_info.name }}</div> |
| 15 | - <div class="item-name" v-html="formatNameWithSuperscript(student_info.name)"></div> | 15 | + <div class="item-name" v-html="formatNameWithSuperscript(student_info.courtesy_name)"></div> |
| 16 | <div class="item-group-title">{{ student_info.group_title }}</div> | 16 | <div class="item-group-title">{{ student_info.group_title }}</div> |
| 17 | <div class="item-desc" v-html="student_info.desc"></div> | 17 | <div class="item-desc" v-html="student_info.desc"></div> |
| 18 | </div> | 18 | </div> |
| ... | @@ -44,6 +44,10 @@ | ... | @@ -44,6 +44,10 @@ |
| 44 | <div v-else> | 44 | <div v-else> |
| 45 | <div class="empty-message">暂无相关照片</div> | 45 | <div class="empty-message">暂无相关照片</div> |
| 46 | </div> | 46 | </div> |
| 47 | + | ||
| 48 | + <div class="more-button" @click="viewMore()"> | ||
| 49 | + <span class="more-text">查看更多</span> | ||
| 50 | + </div> | ||
| 47 | </div> | 51 | </div> |
| 48 | </template> | 52 | </template> |
| 49 | 53 | ||
| ... | @@ -174,6 +178,10 @@ onMounted(() => { | ... | @@ -174,6 +178,10 @@ onMounted(() => { |
| 174 | // | 178 | // |
| 175 | loadUserInfo() | 179 | loadUserInfo() |
| 176 | }) | 180 | }) |
| 181 | + | ||
| 182 | +const viewMore = () => { | ||
| 183 | + router.push({ path: '/students', query: { i: '3680502' } }) | ||
| 184 | +} | ||
| 177 | </script> | 185 | </script> |
| 178 | 186 | ||
| 179 | <style scoped> | 187 | <style scoped> |
| ... | @@ -198,6 +206,21 @@ onMounted(() => { | ... | @@ -198,6 +206,21 @@ onMounted(() => { |
| 198 | margin-top: 2rem; | 206 | margin-top: 2rem; |
| 199 | } | 207 | } |
| 200 | 208 | ||
| 209 | +.more-button { | ||
| 210 | + position: static; | ||
| 211 | + margin: 1rem auto; | ||
| 212 | + height: 2.5rem; | ||
| 213 | + width: 8rem; | ||
| 214 | + display: flex; | ||
| 215 | + align-items: center; | ||
| 216 | + justify-content: center; | ||
| 217 | + cursor: pointer; | ||
| 218 | + z-index: 3; | ||
| 219 | + transition: all 0.3s ease; | ||
| 220 | + background-color: #985122; | ||
| 221 | + color: #FCF8F1; | ||
| 222 | + border-radius: 0.25rem; | ||
| 223 | +} | ||
| 201 | 224 | ||
| 202 | /* 下载提示样式(参考首页 swipe-hint) */ | 225 | /* 下载提示样式(参考首页 swipe-hint) */ |
| 203 | .download-hint { | 226 | .download-hint { | ... | ... |
-
Please register or login to post a comment