From 05316275ee6f1623cc022a3cb4967a440c105a6b Mon Sep 17 00:00:00 2001
From: cloudroam <cloudroam>
Date: 星期二, 29 七月 2025 16:43:42 +0800
Subject: [PATCH] add：编辑资料
---
sub-pages/mine/index.vue | 227 ++++++++++++++++++++++++++++++++++++++++++++------------
1 files changed, 177 insertions(+), 50 deletions(-)
diff --git a/sub-pages/mine/index.vue b/sub-pages/mine/index.vue
index 6a80c45..436e163 100644
--- a/sub-pages/mine/index.vue
+++ b/sub-pages/mine/index.vue
@@ -3,17 +3,18 @@
<view class="profile-section" :style="backgroundStyle">
<up-sticky bgColor="#000">
<view class="top-bar">
- <up-icon name="list" size="60rpx" color="#D0E1E9" @click="onSettingClick" />
+ <up-icon name="setting" size="60rpx" color="#D0E1E9" @click="onSettingClick" />
+<!-- <up-icon name="list" size="60rpx" color="#D0E1E9" @click="showUnderDevelopment" />-->
<view class="top-bar-right">
- <up-icon name="share" size="60rpx" color="#D0E1E9" />
+<!-- <up-icon name="share" size="60rpx" color="#D0E1E9" @click="showUnderDevelopment" />-->
</view>
</view>
</up-sticky>
<view class="profile-content">
<view class="profile-header">
<view class="avatar-container">
- <image v-if="userStore.userInfo.customerDTO.cover" class="avatar"
- :src="userStore.userInfo.customerDTO.cover" mode="aspectFill" />
+ <image v-if="userStore?.userInfo?.customerDTO?.cover" class="avatar"
+ :src="userStore?.userInfo?.customerDTO?.cover" mode="aspectFill" />
<image v-else class="avatar"
src="https://ai-public.mastergo.com/ai/img_res/e8ae645c666c247b895b488e60b048f5.jpg" mode="aspectFill" />
<view class="add-icon">
@@ -21,45 +22,45 @@
</view>
</view>
<view class="user-info">
- <view class="username">影途 {{ userStore?.userInfo?.customerDTO?.name }}</view>
- <view class="user-id">影途号：{{ userStore?.userInfo?.customerDTO?.id }}</view>
+ <view class="username">影游四方 {{ userStore?.userInfo?.customerDTO?.name }}</view>
+ <view class="user-id">影游四方号：{{ userStore?.userInfo?.customerDTO?.id }}</view>
<view class="location">IP 属地：{{ userStore.address?.ad_info?.province }}</view>
</view>
</view>
- <view class="edit-profile">点击这里，填写简介</view>
+<!-- <view class="edit-profile" >点击这里，填写简介</view>-->
<view class="stats">
<view class="stat-row">
- <view class="stat-item">
- <text class="number">0</text>
- <text class="label">关注</text>
- </view>
- <view class="stat-item">
- <text class="number">0</text>
- <text class="label">粉丝</text>
- </view>
- <view class="stat-item">
+<!-- <view class="stat-item">-->
+<!-- <text class="number">0</text>-->
+<!-- <text class="label">关注</text>-->
+<!-- </view>-->
+<!-- <view class="stat-item">-->
+<!-- <text class="number">0</text>-->
+<!-- <text class="label">粉丝</text>-->
+<!-- </view>-->
+<!-- <view class="stat-item">
<text class="number">1</text>
<text class="label">获赞与收藏</text>
- </view>
+ </view> -->
</view>
<view class="action-buttons">
- <up-button text="编辑资料" size="mini" type="info" plain hairline
+ <up-button text="编辑资料" size="mini" type="info" plain hairline @click="navigateTo('/sub-pages/mine/profile-edit')"
:custom-style="{ backgroundColor: 'transparent', borderColor: '#B1ABA9' }" />
- <up-icon name="setting" size="40rpx" @click="gotoUrl('/sub-pages/mine/settings')" />
+<!-- <up-icon name="setting" size="40rpx" @click="navigateTo('/sub-pages/mine/settings')" />-->
</view>
</view>
</view>
- <scroll-view class="function-cards" scroll-x show-scrollbar="false">
- <view class="card" v-for="item in cardList" :key="item.title">
- <view class="card-content">
- <text class="card-title">{{ item.title }}</text>
- <text class="card-subtitle">{{ item.subtitle }}</text>
- </view>
- </view>
- </scroll-view>
+<!-- <scroll-view class="function-cards" scroll-x show-scrollbar="false">-->
+<!-- <view class="card" v-for="item in cardList" :key="item.title" @click="showUnderDevelopment">-->
+<!-- <view class="card-content">-->
+<!-- <text class="card-title">{{ item.title }}</text>-->
+<!-- <text class="card-subtitle">{{ item.subtitle }}</text>-->
+<!-- </view>-->
+<!-- </view>-->
+<!-- </scroll-view>-->
</view>
<view class="tab-section">
@@ -68,20 +69,67 @@
activeStyle="color: #2979ff" />
</up-sticky>
+
+<!-- <swiper class="swiper-box" :current="current" @change="onSwiperChange" duration="300">-->
+<!-- <swiper-item v-for="(item, index) in tabList" :key="index">-->
+<!-- <view v-if="!userStore.hasLogin" class="empty-state">-->
+<!-- <text class="empty-text">请登录后查看{{ item.name }}</text>-->
+<!-- </view>-->
+<!-- <view v-else-if="getCurrentList.length === 0" class="empty-state">-->
+<!-- <text class="empty-text">暂无{{ item.name }}内容</text>-->
+<!-- </view>-->
+<!-- <view v-else class="list-view">-->
+<!-- <up-waterfall v-model="getCurrentList">-->
+<!-- <template #left="{ leftList }">-->
+<!-- <FlowCard-->
+<!-- v-for="(item, index) in leftList"-->
+<!-- :key="index"-->
+<!-- :item="item"-->
+<!-- @click="handleDetailClick"-->
+<!-- />-->
+<!-- </template>-->
+<!-- <template #right="{ rightList }">-->
+<!-- <FlowCard-->
+<!-- v-for="(item, index) in rightList"-->
+<!-- :key="index"-->
+<!-- :item="item"-->
+<!-- @click="handleDetailClick"-->
+<!-- />-->
+<!-- </template>-->
+<!-- </up-waterfall>-->
+<!-- <up-loadmore :status="loading ? 'loading' : 'nomore'" :line="true" />-->
+<!-- </view>-->
+<!-- </swiper-item>-->
+<!-- </swiper>-->
<swiper class="swiper-box" :current="current" @change="onSwiperChange" duration="300">
<swiper-item v-for="(item, index) in tabList" :key="index">
- <view class="empty-state">
- <image class="empty-icon"
- src="https://ai-public.mastergo.com/ai/img_res/fc3cb775274ef0f5e58ac01687a9c121.jpg" mode="aspectFit" />
- <text class="empty-text">快去发布你的笔记吧</text>
- <up-button class="publish-btn" size="mini" type="warning" shape="circle">去发布</up-button>
+ <view class="list-view">
+ <up-waterfall v-model="getCurrentList">
+ <template #left="{ leftList }">
+ <FlowCard
+ v-for="(item, index) in leftList"
+ :key="index"
+ :item="item"
+ @click="handleDetailClick"
+ />
+ </template>
+ <template #right="{ rightList }">
+ <FlowCard
+ v-for="(item, index) in rightList"
+ :key="index"
+ :item="item"
+ @click="handleDetailClick"
+ />
+ </template>
+ </up-waterfall>
+ <up-loadmore :status="loading ? 'loading' : 'nomore'" :line="true" />
</view>
</swiper-item>
</swiper>
</view>
<common-footer flg="0" />
- <setting-popup v-model="settingShow" />
+<!-- <setting-popup v-model="settingShow" />-->
</view>
</template>
@@ -93,6 +141,8 @@
import { useUserStore } from '@/store/user'
import { useLocation } from '@/composables/useLocation'
import { useNavigator } from '@/composables/useNavigator'
+import { FilmWorks } from '@/types/index'
+import{ getFilmCollectList, getFilmLikeList} from '@/sub-pages/utils/api'
const { apitype } = usePlatformLoginType()
const userStore = useUserStore()
@@ -100,23 +150,34 @@
const {getLocation,province } = useLocation()
-const gotoUrl = (url: string) => {
- navigateTo(url)
-}
-
watch(
() => userStore.userInfo, // 监听 userInfo 这个响应式属性
(newVal, oldVal) => {
console.log('userInfo 发生变化:', newVal)
+ if (newVal && userStore.hasLogin) {
+ fetchList();
+ } else {
+ // 用户未登录，清空列表
+ likeList.value = [];
+ collectList.value = [];
+ }
},
{ deep: true } // 如果 userInfo 是对象，需要深度监听其属性变化
)
onShow(() => {
- console.log('我的')
getLocation()
+ if (userStore.hasLogin) {
+ // 强制刷新用户信息
+ userStore.getCurrentInfo().then(() => {
+ fetchList();
+ });
+ }else {
+ // 用户未登录，清空列表
+ likeList.value = [];
+ collectList.value = [];
+ }
});
-
// 当前 tab 索引
@@ -128,9 +189,13 @@
// 控制设置弹窗显示
const settingShow = ref(false);
+const likeList = ref<FilmWorks[]>([]);
+const collectList = ref<FilmWorks[]>([]);
+const loading = ref(false);
+const noMore = ref(false);
// tab 列表
const tabList = ref([
- { name: '笔记' },
+ // { name: '笔记' },
{ name: '收藏' },
{ name: '赞过' },
]);
@@ -151,16 +216,68 @@
});
// 方法定义
-function onSettingClick() {
- settingShow.value = true;
+const onSettingClick= ()=> {
+ // settingShow.value = true;
+ uni.navigateTo({ url: '/sub-pages/mine/settings' })
}
-function onTabChange(item: { index: number }) {
+const onTabChange=(item: { index: number })=> {
current.value = item.index;
+ // 切换tab时检查是否需要加载数据
+ if (userStore.hasLogin &&
+ ((current.value === 0 && collectList.value.length === 0) ||
+ (current.value === 1 && likeList.value.length === 0))) {
+ fetchList();
+ }
}
-function onSwiperChange(e: any) {
+const onSwiperChange=(e: any) => {
current.value = e.detail.current;
+ onTabChange({ index: e.detail.current });
+}
+
+const handleDetailClick = (item: FilmWorks) => {
+ navigateTo(`/sub-pages/film-list/film-detail?id=${item.id}`);
+};
+
+const getCurrentList = computed(() => {
+ return current.value === 0 ? collectList.value : likeList.value;
+});
+const fetchList = async () => {
+ if (!userStore.hasLogin || loading.value || noMore.value) return;
+ loading.value = true;
+ try {
+ if (current.value === 0) {
+ // 获取收藏列表
+ collectList.value = [];
+ const res = await getFilmCollectList({
+ userId: userStore.userInfo?.customerDTO?.id
+ });
+ collectList.value = res || [];
+ } else {
+ // 获取点赞列表
+ likeList.value = [];
+ const res = await getFilmLikeList({
+ userId: userStore.userInfo?.customerDTO?.id
+ });
+ likeList.value = res || [];
+ }
+ } catch (error) {
+ console.error('获取列表失败:', error);
+ uni.showToast({ title: '获取数据失败', icon: 'none' });
+ } finally {
+ loading.value = false;
+ }
+};
+const goToProfile= ()=> {
+ navigateTo('/sub-pages/mine/edit-profile');
+};
+
+const showUnderDevelopment = () => {
+ uni.showToast({
+ title: '功能正在开发中',
+ icon: 'none'
+ });
}
</script>
@@ -328,7 +445,7 @@
.card {
display: inline-block;
- width: 180rpx;
+ width: 100%;
height: 80rpx;
margin-left: 20rpx;
background-color: rgba(60, 60, 60, 0.4);
@@ -427,11 +544,21 @@
border-radius: 32rpx !important;
padding: 0 48rpx !important;
}
+.swiper-box {
+ min-height: calc(100vh - 200rpx);
+ /*padding: 20rpx 0;*/
+}
+
+.list-view {
+ /*padding: 0 20rpx;*/
+ background-color: #fff;
+}
</style>
<style lang="scss" scoped>
-.swiper-box {
- // min-height: 600rpx;
- /* 或 100vh，或具体 px */
- min-height: 800px;
-}
+//.swiper-box {
+// // min-height: 600rpx;
+// /* 或 100vh，或具体 px */
+// min-height: 800px;
+//}
+
</style>
\ No newline at end of file
--
Gitblit v1.9.3