而我却
This commit is contained in:
zpc
parent
cc8f99e77c
commit
2d4ffabd9e
|
|
@ -53,12 +53,7 @@ onMounted(() => {
|
|||
|
||||
<!-- 隐私政策内容 -->
|
||||
<view v-else class="privacy-content">
|
||||
<!-- 标题 -->
|
||||
<view class="privacy-header">
|
||||
<text class="privacy-title">{{ title }}</text>
|
||||
<text v-if="updateTime" class="update-time">更新时间：{{ updateTime }}</text>
|
||||
</view>
|
||||
|
||||
|
||||
<!-- 正文内容 -->
|
||||
<view class="privacy-body">
|
||||
<rich-text v-if="content" :nodes="content" class="rich-content"></rich-text>
|
||||
|
|
|
|||
|
|
@ -53,12 +53,7 @@ onMounted(() => {
|
|||
|
||||
<!-- 协议内容 -->
|
||||
<view v-else class="agreement-content">
|
||||
<!-- 标题 -->
|
||||
<view class="agreement-header">
|
||||
<text class="agreement-title">{{ title }}</text>
|
||||
<text v-if="updateTime" class="update-time">更新时间：{{ updateTime }}</text>
|
||||
</view>
|
||||
|
||||
|
||||
<!-- 正文内容 -->
|
||||
<view class="agreement-body">
|
||||
<rich-text v-if="content" :nodes="content" class="rich-content"></rich-text>
|
||||
|
|
|
|||
|
|
@ -1,74 +1,42 @@
|
|||
<template>
|
||||
<view class="team-page">
|
||||
<!-- 自定义导航栏 -->
|
||||
<view class="custom-navbar" :style="navbarStyle">
|
||||
<view class="navbar-content" :style="{ height: navbarHeight + 'px' }">
|
||||
<text class="navbar-title">团队</text>
|
||||
<!-- 加载状态 -->
|
||||
<Loading v-if="pageLoading" type="page" :loading="true" />
|
||||
|
||||
<!-- 团队介绍图片 -->
|
||||
<view v-else class="team-content">
|
||||
<template v-if="teamImages.length > 0">
|
||||
<image
|
||||
v-for="(item, index) in teamImages"
|
||||
:key="index"
|
||||
:src="item"
|
||||
mode="scaleToFill"
|
||||
class="team-image"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<!-- 无数据时显示空状态 -->
|
||||
<view v-else class="empty-state">
|
||||
<image src="/static/ic_empty.png" mode="aspectFit" class="empty-icon" />
|
||||
<text class="empty-text">暂无团队介绍</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 导航栏占位 -->
|
||||
<view class="navbar-placeholder" :style="{ height: totalNavbarHeight + 'px' }"></view>
|
||||
|
||||
<!-- 页面内容 -->
|
||||
<view class="page-content">
|
||||
<!-- 加载状态 -->
|
||||
<Loading v-if="pageLoading" type="page" :loading="true" />
|
||||
|
||||
<!-- 团队介绍图片 -->
|
||||
<view v-else class="team-content">
|
||||
<!-- 有数据时显示图片列表 -->
|
||||
<template v-if="teamImages.length > 0">
|
||||
<image
|
||||
v-for="(item, index) in teamImages"
|
||||
:key="index"
|
||||
:src="item.imageUrl"
|
||||
mode="widthFix"
|
||||
class="team-image"
|
||||
@load="handleImageLoad(index)"
|
||||
@error="handleImageError(index)"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<!-- 无数据时显示空状态 -->
|
||||
<view v-else class="empty-state">
|
||||
<image
|
||||
src="/static/ic_empty.png"
|
||||
mode="aspectFit"
|
||||
class="empty-icon"
|
||||
/>
|
||||
<text class="empty-text">暂无团队介绍</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 底部安全区域 -->
|
||||
<view class="safe-bottom"></view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
/**
|
||||
* 团队页面
|
||||
* 展示团队介绍图片
|
||||
* 展示团队介绍图片，全屏无导航栏
|
||||
*/
|
||||
import { ref, computed, onMounted } from 'vue'
|
||||
import { useNavbar } from '@/composables/useNavbar.js'
|
||||
import { ref, onMounted } from 'vue'
|
||||
import { getTeamInfo } from '@/api/team.js'
|
||||
import Loading from '@/components/Loading/index.vue'
|
||||
|
||||
const { statusBarHeight, navbarHeight, totalNavbarHeight } = useNavbar()
|
||||
|
||||
// 页面状态
|
||||
const pageLoading = ref(true)
|
||||
const teamImages = ref([])
|
||||
|
||||
// 导航栏样式
|
||||
const navbarStyle = computed(() => ({
|
||||
paddingTop: statusBarHeight.value + 'px',
|
||||
height: totalNavbarHeight.value + 'px'
|
||||
}))
|
||||
|
||||
/**
|
||||
* 加载团队介绍数据
|
||||
*/
|
||||
|
|
@ -77,48 +45,23 @@ async function loadTeamInfo() {
|
|||
try {
|
||||
const res = await getTeamInfo()
|
||||
if (res && res.code === 0 && res.data) {
|
||||
// 支持多种数据格式
|
||||
if (Array.isArray(res.data)) {
|
||||
teamImages.value = res.data
|
||||
} else if (res.data.list && Array.isArray(res.data.list)) {
|
||||
teamImages.value = res.data.list
|
||||
} else if (res.data.images && Array.isArray(res.data.images)) {
|
||||
teamImages.value = res.data.images
|
||||
} else if (res.data.imageUrl) {
|
||||
// 单张图片的情况
|
||||
teamImages.value = [{ imageUrl: res.data.imageUrl }]
|
||||
const images = res.data.images || res.data.list || res.data
|
||||
if (Array.isArray(images)) {
|
||||
teamImages.value = images.map(item =>
|
||||
typeof item === 'string' ? item : (item.imageUrl || item)
|
||||
)
|
||||
} else {
|
||||
teamImages.value = []
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('加载团队介绍失败:', error)
|
||||
uni.showToast({
|
||||
title: '加载失败，请稍后重试',
|
||||
icon: 'none'
|
||||
})
|
||||
uni.showToast({ title: '加载失败，请稍后重试', icon: 'none' })
|
||||
} finally {
|
||||
pageLoading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 图片加载成功
|
||||
*/
|
||||
function handleImageLoad(index) {
|
||||
console.log(`团队图片 ${index + 1} 加载成功`)
|
||||
}
|
||||
|
||||
/**
|
||||
* 图片加载失败
|
||||
*/
|
||||
function handleImageError(index) {
|
||||
console.error(`团队图片 ${index + 1} 加载失败`)
|
||||
}
|
||||
|
||||
/**
|
||||
* 页面加载
|
||||
*/
|
||||
onMounted(() => {
|
||||
loadTeamInfo()
|
||||
})
|
||||
|
|
@ -129,79 +72,33 @@ onMounted(() => {
|
|||
|
||||
.team-page {
|
||||
min-height: 100vh;
|
||||
background-color: $bg-color;
|
||||
}
|
||||
|
||||
// 自定义导航栏
|
||||
.custom-navbar {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
background-color: $bg-white;
|
||||
z-index: 999;
|
||||
|
||||
.navbar-content {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.navbar-title {
|
||||
font-size: 34rpx;
|
||||
font-weight: $font-weight-medium;
|
||||
color: $text-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-placeholder {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
// 页面内容
|
||||
.page-content {
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
}
|
||||
|
||||
// 团队内容区域
|
||||
.team-content {
|
||||
padding: $spacing-lg;
|
||||
|
||||
.team-image {
|
||||
width: 100%;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
display: block;
|
||||
margin-bottom: $spacing-md;
|
||||
border-radius: $border-radius-lg;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 空状态
|
||||
.empty-state {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 200rpx 0;
|
||||
|
||||
height: 100vh;
|
||||
|
||||
.empty-icon {
|
||||
width: 200rpx;
|
||||
height: 200rpx;
|
||||
margin-bottom: $spacing-lg;
|
||||
}
|
||||
|
||||
|
||||
.empty-text {
|
||||
font-size: $font-size-md;
|
||||
color: $text-placeholder;
|
||||
}
|
||||
}
|
||||
|
||||
// 底部安全区域
|
||||
.safe-bottom {
|
||||
height: 40rpx;
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user