From 87c4b63ce203f0fb34241eda92caeccbaceb7f54 Mon Sep 17 00:00:00 2001
From: quling <377956897@qq.com>
Date: 星期六, 22 八月 2026 15:11:01 +0800
Subject: [PATCH] feat0806: APP养生科普健康知识功能改造
---
traditionalApp/pages/publish/publish.vue | 69 ++++++++++++++++++----------------
1 files changed, 36 insertions(+), 33 deletions(-)
diff --git a/traditionalApp/pages/publish/publish.vue b/traditionalApp/pages/publish/publish.vue
index 9f48c75..e13aa36 100644
--- a/traditionalApp/pages/publish/publish.vue
+++ b/traditionalApp/pages/publish/publish.vue
@@ -15,9 +15,7 @@
<view v-if="articleList.length" class="article-list">
<view class="article-item" v-for="item in articleList" :key="item.id" @tap="goToDetail(item.id)">
<image class="article-img" :src="item.coverImage || defaultCoverImage" mode="aspectFill"></image>
- <view class="article-shadow">
- <text class="article-text">{{ item.title }}</text>
- </view>
+ <text class="article-title">{{ item.title }}</text>
</view>
</view>
<view v-else-if="loading" class="status-text">加载中...</view>
@@ -28,7 +26,7 @@
<script setup lang="ts">
import { ref, onMounted } from 'vue';
-import { onPullDownRefresh } from '@dcloudio/uni-app'
+import { onLoad, onPullDownRefresh } from '@dcloudio/uni-app'
import { getHealthPopularizationList } from './service'
interface PopularizationListItem {
@@ -43,6 +41,18 @@
const loading = ref(false)
const articleList = ref<PopularizationListItem[]>([])
const defaultCoverImage = '/static/image/home/zixun.png'
+// 内容类型：1 健康知识，默认按健康知识过滤。
+const contentType = ref<number>(1)
+
+/**
+ * 读取路由参数中的内容类型，用于按类型过滤列表。
+ */
+onLoad((options) => {
+ const raw = Number(options?.contentType)
+ if (!Number.isNaN(raw) && raw > 0) {
+ contentType.value = raw
+ }
+})
/**
* 页面加载时初始化状态栏高度并拉取健康知识列表。
@@ -87,7 +97,7 @@
async function loadPopularizationList() {
loading.value = true
try {
- const response = await getHealthPopularizationList()
+ const response = await getHealthPopularizationList(contentType.value)
if (response?.code !== 0 || !Array.isArray(response.data)) {
articleList.value = []
return
@@ -166,43 +176,36 @@
.article-list {
display: flex;
- justify-content: space-between;
- flex-wrap: wrap;
+ flex-direction: column;
}
.article-item {
- width: 328rpx;
- height: 328rpx;
- border-radius: 16rpx;
- position: relative;
- overflow: hidden;
- margin-bottom: 24rpx;
-}
-
-.article-img {
- width: 100%;
- height: 100%;
-}
-
-.article-shadow {
- position: absolute;
- bottom: 0;
- left: 0;
- width: 100%;
- height: 64rpx;
- background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 100%);
display: flex;
align-items: center;
- padding: 0 16rpx;
+ width: 100%;
+ padding: 24rpx 0;
+ border-bottom: 1rpx solid #F0F0F0;
box-sizing: border-box;
}
-.article-text {
- color: #FFFFFF;
- font-size: 24rpx;
- white-space: nowrap;
+.article-img {
+ width: 200rpx;
+ height: 150rpx;
+ border-radius: 12rpx;
+ flex-shrink: 0;
+ background-color: #F5F6F8;
+}
+
+.article-title {
+ flex: 1;
+ margin-left: 24rpx;
+ font-size: 30rpx;
+ line-height: 44rpx;
+ color: #333;
+ display: -webkit-box;
+ -webkit-box-orient: vertical;
+ -webkit-line-clamp: 2;
overflow: hidden;
text-overflow: ellipsis;
- width: 100%;
}
</style>
--
Gitblit v1.7.1