完善页面

This commit is contained in:
wangxiaowei
2025-12-29 14:39:14 +08:00
parent 14ddb7ce7b
commit 338a99a54a
15 changed files with 1347 additions and 1314 deletions

View File

@ -7,36 +7,38 @@
<template>
<view class="page-container pb-100rpx">
<!-- 顶部背景区域 -->
<view class="top-bg fixed left-0 top-0 w-[100%]"
:style="{ backgroundImage: `url('${OSS}images/chayishi/profile_bg.png')` }">
<wd-navbar safe-area-inset-top :bordered="false" custom-style="background-color: transparent !important;">
<template #left>
<view class="ml-16rpx flex items-center" />
</template>
<template #right>
<view class="right-slot mr-16rpx flex items-center">
<!-- 消息图标带红点 -->
<view class="nav-icon-item relative mr-24rpx" @click="My.handleToMessage">
<wd-img :src="`${OSS}icon/icon_notify.png`" width="36rpx" height="36rpx"></wd-img>
<view class="message-dot absolute right-6rpx top-10rpx h-16rpx w-16rpx border-2rpx border-[#fff] rounded-full border-solid bg-[#FF0000]" />
<text
class="icon-label text-20rpx text-[#606266] top-20rpx">
消息
</text>
</view>
<!-- 设置图标 -->
<view class="nav-icon-item relative mr-24rpx" @click="My.handleToSettings">
<wd-img :src="`${OSS}icon/icon_setting.png`" width="36rpx" height="36rpx"></wd-img>
<text
class="icon-label text-20rpx text-[#606266] top-20rpx">
设置
</text>
</view>
<view class="page-container pb-120rpx">
<wd-navbar safe-area-inset-top :bordered="false" custom-style="background-color: transparent !important;" fixed>
<template #left>
<view class="ml-16rpx flex items-center" />
</template>
<template #right>
<view class="right-slot mr-16rpx flex items-center">
<!-- 消息图标带红点 -->
<view class="nav-icon-item relative mr-30rpx" @click="router.navigateTo('/bundle/notice/notice')">
<wd-img :src="`${OSS}icon/icon_notify.png`" width="36rpx" height="36rpx"></wd-img>
<view class="message-dot absolute right-6rpx top-10rpx h-16rpx w-16rpx border-2rpx border-[#fff] rounded-full border-solid bg-[#FF0000]" />
<text
class="icon-label text-20rpx text-[#606266] top-20rpx">
消息
</text>
</view>
</template>
</wd-navbar>
<!-- 设置图标 -->
<view class="nav-icon-item relative mr-24rpx" @click="router.navigateTo('/bundle/store/setting')">
<wd-img :src="`${OSS}icon/icon_setting.png`" width="36rpx" height="36rpx"></wd-img>
<text
class="icon-label text-20rpx text-[#606266] top-20rpx">
设置
</text>
</view>
</view>
</template>
</wd-navbar>
<!-- 顶部背景区域 -->
<view class="top-bg fixed left-0 top-0 w-[100%] h-500rpx"
:style="{ backgroundImage: `url('${OSS}images/chayishi/profile_bg.png')` }">
</view>
<view class="content-wrapper" :style="{ paddingTop: `${navbarHeight}px` }">
@ -49,7 +51,7 @@
mode="aspectFill" round />
</view>
<!-- 昵称和账号 -->
<view class="ml-22rpx flex-1" @click="My.handleToProfile">
<view class="ml-22rpx flex-1" @click="router.navigateTo('/bundle/profile/profile')">
<view class="flex items-center">
<text class="nickname text-36rpx text-[#303133] font-bold leading-50rpx">Jasmine</text>
<view>
@ -75,7 +77,7 @@
</view>
<!-- 提现按钮 -->
<view class="withdraw-btn mt-8rpx rounded-8rpx bg-[#FF0000] px-24rpx py-6rpx"
@click="My.handleToWithdraw">
@click="router.navigateTo('/bundle/wallet/wallet')">
<text class="text-24rpx text-[#fff] font-medium">去提现</text>
</view>
</view>
@ -153,6 +155,17 @@
<view class="schedule-item flex items-start">
<text class="label-text w-140rpx pt-4rpx text-24rpx text-[#606266] leading-40rpx">住址:</text>
<text class="flex-1 text-24rpx text-[#303133] leading-40rpx">上海浦东新区新金桥路58号新银东大厦15楼F室</text>
</view>
<!-- 上下班状态 -->
<view class="schedule-item flex items-center mt-20rpx">
<view class="label-text w-140rpx pt-4rpx text-24rpx text-[#606266] leading-40rpx">上下班:</view>
<view class="flex items-center">
<view class="mt-20rpx">
<wd-switch v-model="isWork" size="32rpx" active-color="#4C9F44"/>
</view>
<view class="text-28rpx text-[#606266] mt-6rpx font-bold ml-10rpx">{{ isWork ? '上班中' : '已下班' }}</view>
</view>
</view>
</view>
@ -185,7 +198,7 @@
<text class="text-24rpx text-[#303133] leading-34rpx">工作时间</text>
</view>
<!-- 位置更新 -->
<view class="service-item flex flex-col items-center" @click="My.handleServiceClick('location')">
<view class="service-item flex flex-col items-center" @click="router.navigateTo('/bundle/address/list')">
<view
class="service-icon-wrapper h-96rpx w-96rpx flex items-center justify-center rounded-16rpx bg-[#FFFFFF]">
<wd-img width="48rpx" height="48rpx" :src="`${OSS}images/chayishi/location_update.png`" />
@ -193,7 +206,7 @@
<text class="text-24rpx text-[#303133] leading-34rpx">位置更新</text>
</view>
<!-- 收入统计 -->
<view class="service-item flex flex-col items-center" @click="My.handleServiceClick('income')">
<view class="service-item flex flex-col items-center" @click="router.navigateTo('/bundle/finance/finance')">
<view
class="service-icon-wrapper h-96rpx w-96rpx flex items-center justify-center rounded-16rpx bg-[#FFFFFF]">
<wd-img width="48rpx" height="48rpx" :src="`${OSS}images/chayishi/income.png`" />
@ -246,6 +259,9 @@ const OSS = inject('OSS')
const navbarHeight = inject('navbarHeight')
const rightPadding = inject('capsuleOffset')
// 上下班切换
const isWork = ref<boolean>(true)
// 模拟是否有个人信息静态页面后续可以替换为实际的API判断
const hasProfileInfo = ref(true) // 改为 false 可以测试跳转到填写页面
@ -380,6 +396,7 @@ page {
.wallet-amounts {
position: relative;
z-index: 2;
margin-top: 50rpx;
}
.coin-decoration {