fix(miniapp): 调整首页圆角布局并隐藏滚动条

shinnosuke

4 天以前 5ce0d76154bf4c1d70543476cdfad9a30195b0f8

 rencaika/pages/news/news.uvue

@@ -10,7 +10,7 @@
         <view class="nav-bottom-space"></view>
      </view>

      <scroll-view class="news-scroll" scroll-y lower-threshold="80" @scrolltolower="loadMoreNews">
      <scroll-view :show-scrollbar="false" class="news-scroll" scroll-y lower-threshold="80" @scrolltolower="loadMoreNews">
         <view v-if="initialLoading" class="list-state"><view class="loading-spinner"></view><text>正在加载人才资讯</text></view>
         <view v-else-if="initialError" class="list-state error-state"><text>人才资讯加载失败</text><text class="retry-text" @tap="retryInitialLoad">重新加载</text></view>
         <view v-else-if="hasLoaded && visibleNews.length == 0" class="list-state"><text>暂无人才资讯</text></view>
@@ -21,7 +21,8 @@
                  <text class="news-summary">{{item.summary}}</text>
                  <view class="news-meta"><text v-if="item.tag != ''" class="news-tag">{{item.tag}}</text><text class="news-time">{{item.time}}</text></view>
               </view>
               <image class="news-thumb" src="/static/news-assets/meeting-thumb.jpg" mode="aspectFill"></image>
               <!-- 缩略图用后台配置的封面；没配就留空（灰底占位），不再统一显示那张默认会议厅图。 -->
               <image class="news-thumb" :src="item.image != null ? item.image : ''" mode="aspectFill" @error="replaceImage(item)"></image>
            </view>
         </view>
         <view v-if="loadingMore" class="loading-row"><view class="loading-spinner"></view><text>正在加载</text></view>
@@ -35,6 +36,7 @@
<script setup lang="uts">
   import { isApiConfigured } from '../../config/api.uts'
   import { getNews } from '../../services/portal.uts'
   import { resolveApiUrl } from '../../services/http.uts'
   import { safeBack } from '../../utils/navigation.uts'

   const navTop = ref(28)
@@ -55,6 +57,8 @@
   const failInitialOnce = ref(false)
   const failLoadMoreOnce = ref(false)
   const forceEmpty = ref(false)
   // 封面图加载失败时置空，交给灰底占位，避免出现破图。
   const replaceImage = (item: any) => { item.image = '' }

   onLoad((options: any) => {
      // #ifdef MP-WEIXIN
@@ -111,7 +115,9 @@
            title: item.title != null ? item.title as string : '人才资讯',
            summary: contentPreview(item.contentPreview),
            tag: newsTagText(item.summary),
            time: formatNewsTime(item.publishTime)
            time: formatNewsTime(item.publishTime),
            // 后台配置的封面图；相对路径补成接口域名，没配就留空走灰底占位。
            image: item.coverUrl != null && ('' + item.coverUrl).trim() != '' ? resolveApiUrl('' + item.coverUrl) : ''
         })
      }
      return mapped
@@ -225,6 +231,7 @@
      不覆盖的话标签不会收缩，只会顶出卡片、把时间挤没（省略号也不会出现）。 */
   .news-tag { display: block; flex: 0 1 auto; flex-grow: 0; flex-shrink: 1; flex-basis: auto; min-width: 0; padding: 5rpx 9rpx; border-radius: 6rpx; background-color: #FFF8EA; color: #F1A32D; font-size: 19rpx; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
   .news-time { margin-left: 13rpx; color: #A5A8AE; font-size: 20rpx; flex-shrink: 0; }
   .news-thumb { width: 236rpx; height: 168rpx; border-radius: 7rpx; flex-shrink: 0; }
   /* 灰底占位：后台没配封面时不会出现破图或那张默认会议厅图。 */
   .news-thumb { width: 236rpx; height: 168rpx; border-radius: 7rpx; background-color: #EEEEEE; flex-shrink: 0; }
   .bottom-space { height: calc(28rpx + env(safe-area-inset-bottom)); }
</style>