个人中心页0.8
This commit is contained in:
WindowBird
parent
cc609f6504
commit
26ecf5f4c8
51
pages.json
51
pages.json
|
|
@ -174,39 +174,40 @@
|
|||
}
|
||||
},
|
||||
{
|
||||
"path" : "pages/activity/application",
|
||||
"style" :
|
||||
{
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
"path": "pages/activity/application",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path" : "pages/activity/appointmentSuccess",
|
||||
"style" :
|
||||
{
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
"path": "pages/activity/appointmentSuccess",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path" : "pages/activity/reservationVegetarianMeals",
|
||||
"style" :
|
||||
{
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
"path": "pages/activity/reservationVegetarianMeals",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path" : "pages/activity/ReservationSuccess",
|
||||
"style" :
|
||||
{
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
"path": "pages/activity/ReservationSuccess",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path" : "pages/activity/myReservation",
|
||||
"style" :
|
||||
{
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
"path": "pages/activity/myReservation",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/personalCenter/personalCenter",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
}
|
||||
],
|
||||
"subPackages": [
|
||||
|
|
|
|||
|
|
@ -96,8 +96,6 @@ export default {
|
|||
|
||||
// 活动ID
|
||||
activityId: "",
|
||||
// 活动名称
|
||||
activityName: "",
|
||||
|
||||
// 加载状态
|
||||
loading: false,
|
||||
|
|
@ -132,10 +130,6 @@ export default {
|
|||
if (options.actId) {
|
||||
this.activityId = parseInt(options.actId);
|
||||
}
|
||||
// 如果传递了活动名称，使用传递的名称
|
||||
if (options.activityName) {
|
||||
this.activityName = decodeURIComponent(options.activityName);
|
||||
}
|
||||
this.fetchActivitySlots();
|
||||
},
|
||||
methods: {
|
||||
|
|
@ -275,11 +269,10 @@ export default {
|
|||
date: this.getSelectedDateLabel(),
|
||||
time: this.getSelectedTimeLabel(),
|
||||
number: this.getSelectedNumberLabel(),
|
||||
activityName: this.activityName || "活动",
|
||||
};
|
||||
const queryString = Object.keys(params)
|
||||
.map((key) => `${key}=${encodeURIComponent(params[key])}`)
|
||||
.join("&");
|
||||
.map(key => `${key}=${encodeURIComponent(params[key])}`)
|
||||
.join('&');
|
||||
uni.navigateTo({
|
||||
url: `/pages/activity/appointmentSuccess?${queryString}`,
|
||||
});
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
<view class="container">
|
||||
<view class="info">
|
||||
<text class="success">您提交的预约已成功！</text>
|
||||
|
||||
|
||||
<text class="date">预约日期：{{ date }}</text>
|
||||
<text class="time">预约时段：{{ time }}</text>
|
||||
</view>
|
||||
|
|
@ -40,8 +40,8 @@ export default {
|
|||
methods: {
|
||||
// 返回首页
|
||||
back() {
|
||||
uni.switchTab({
|
||||
url: '/pages/index/index'
|
||||
uni.navigateTo({
|
||||
url: `/pages/nearbystores/index`,
|
||||
});
|
||||
},
|
||||
},
|
||||
|
|
|
|||
272
pages/personalCenter/personalCenter.vue
Normal file
272
pages/personalCenter/personalCenter.vue
Normal file
|
|
@ -0,0 +1,272 @@
|
|||
<template>
|
||||
<view class="page">
|
||||
<base-background />
|
||||
<!-- 使用自定义导航栏组件 -->
|
||||
<custom-navbar ref="customNavbar" title="个人中心" />
|
||||
<view class="user-info">
|
||||
<view class="avatar-container">
|
||||
<image
|
||||
class="avatar"
|
||||
mode="aspectFill"
|
||||
src="https://api.ccttiot.com/image-1755237410755.png"
|
||||
/>
|
||||
</view>
|
||||
<view class="user-details">
|
||||
<text class="phone-number">{{ userInfo.phone }}</text>
|
||||
<view class="verification-status">
|
||||
<text class="status-text">{{ userInfo.verificationStatus }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view :style="{ backgroundColor: CommonEnum.BASE_COLOR }" class="header">
|
||||
<!-- 用户信息区域 -->
|
||||
|
||||
<!-- 功能菜单区域 -->
|
||||
<view class="menu-section">
|
||||
<view
|
||||
v-for="(item, index) in menuItems"
|
||||
:key="index"
|
||||
class="menu-item"
|
||||
@click="handleMenuClick(item)"
|
||||
>
|
||||
<view class="menu-icon">
|
||||
<image :src="item.icon" mode="aspectFit" />
|
||||
</view>
|
||||
<text class="menu-text">{{ item.title }}</text>
|
||||
<view class="menu-arrow">
|
||||
<image :src="CommonEnum.RIGHT_CHEVRON" mode="aspectFit" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { CommonEnum } from "@/enum/common.js";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
bgc: {
|
||||
backgroundColor: "#F5F0E7",
|
||||
},
|
||||
CommonEnum,
|
||||
// 加载状态
|
||||
loading: false,
|
||||
// 用户信息
|
||||
userInfo: {
|
||||
phone: "138****8912",
|
||||
verificationStatus: "未实名",
|
||||
},
|
||||
// 菜单项数据
|
||||
menuItems: [
|
||||
{
|
||||
title: "我的预约",
|
||||
icon: CommonEnum.MY_APPOINTMENT,
|
||||
path: "/pages/personalCenter/myAppointment",
|
||||
},
|
||||
{
|
||||
title: "我的收藏",
|
||||
icon: CommonEnum.MY_COLLECTION,
|
||||
path: "/pages/personalCenter/myCollection",
|
||||
},
|
||||
{
|
||||
title: "捐赠历史记录",
|
||||
icon: CommonEnum.MY_DONOR,
|
||||
path: "/pages/personalCenter/donationHistory",
|
||||
},
|
||||
{
|
||||
title: "祈福记录",
|
||||
icon: CommonEnum.MY_PRAY,
|
||||
path: "/pages/personalCenter/prayerRecords",
|
||||
},
|
||||
{
|
||||
title: "寺庙活动",
|
||||
icon: CommonEnum.MY_ACTIVITY,
|
||||
path: "/pages/personalCenter/templeActivities",
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
// 页面加载时获取用户信息
|
||||
this.loadUserInfo();
|
||||
},
|
||||
methods: {
|
||||
// 加载用户信息
|
||||
async loadUserInfo() {
|
||||
this.loading = true;
|
||||
try {
|
||||
// TODO: 调用获取用户信息API
|
||||
// const response = await getUserInfo()
|
||||
// this.userInfo = response.data
|
||||
|
||||
// 模拟加载
|
||||
setTimeout(() => {
|
||||
this.loading = false;
|
||||
}, 500);
|
||||
} catch (error) {
|
||||
console.error("获取用户信息失败:", error);
|
||||
this.loading = false;
|
||||
}
|
||||
},
|
||||
|
||||
// 处理菜单点击
|
||||
handleMenuClick(item) {
|
||||
console.log("点击菜单项:", item.title);
|
||||
|
||||
// 跳转到对应页面
|
||||
if (item.path) {
|
||||
uni.navigateTo({
|
||||
url: item.path,
|
||||
fail: (err) => {
|
||||
console.error("页面跳转失败:", err);
|
||||
uni.showToast({
|
||||
title: "页面开发中",
|
||||
icon: "none",
|
||||
});
|
||||
},
|
||||
});
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.page {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.header {
|
||||
width: 650rpx;
|
||||
margin-top: 24rpx;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
flex-direction: column;
|
||||
padding: 38rpx 50rpx 50rpx 50rpx;
|
||||
background: #fffbf5;
|
||||
border-radius: 20rpx;
|
||||
border: 2rpx solid #c7a26d;
|
||||
margin-bottom: 40rpx;
|
||||
}
|
||||
|
||||
// 用户信息区域
|
||||
.user-info {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 50rpx;
|
||||
margin: 52rpx 0 54rpx 0;
|
||||
//border: red solid 2px;
|
||||
}
|
||||
|
||||
.avatar-container {
|
||||
margin-right: 30rpx;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
border-radius: 60rpx;
|
||||
background: #f0f0f0;
|
||||
}
|
||||
|
||||
.user-details {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.phone-number {
|
||||
font-size: 36rpx;
|
||||
font-weight: 500;
|
||||
color: #695347;
|
||||
margin-bottom: 16rpx;
|
||||
line-height: 1.2;
|
||||
text-align: left;
|
||||
//border: red solid 2px;
|
||||
}
|
||||
|
||||
.verification-status {
|
||||
align-self: flex-start;
|
||||
}
|
||||
|
||||
.status-text {
|
||||
background: #c7a26d;
|
||||
color: #fff;
|
||||
font-size: 24rpx;
|
||||
padding: 8rpx 16rpx;
|
||||
border-radius: 12rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
// 菜单区域
|
||||
.menu-section {
|
||||
width: 100%;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.menu-item {
|
||||
width: 100%;
|
||||
height: 100rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
background: #faf8f3;
|
||||
border-radius: 16rpx;
|
||||
//border: 1rpx solid #d8189b;
|
||||
transition: all 0.3s ease;
|
||||
|
||||
&:active {
|
||||
background: #f0e8d8;
|
||||
transform: scale(0.98);
|
||||
}
|
||||
}
|
||||
|
||||
.menu-icon {
|
||||
width: 60rpx;
|
||||
height: 100rpx;
|
||||
margin-right: 18rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
//border: 1rpx solid #d8189b;
|
||||
|
||||
image {
|
||||
width: 44rpx;
|
||||
height: 44rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.menu-text {
|
||||
flex: 1;
|
||||
font-size: 32rpx;
|
||||
font-weight: 400;
|
||||
color: #695347;
|
||||
line-height: 100rpx;
|
||||
text-align: left;
|
||||
align-items: center;
|
||||
//border: red solid 2px;
|
||||
}
|
||||
|
||||
.menu-arrow {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
//border: red solid 2px;
|
||||
|
||||
image {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue
Block a user