From cfeeba575b1a9934bec9e57141a21f17ad96a6ac Mon Sep 17 00:00:00 2001
From: MrShi <1878285526@qq.com>
Date: 星期三, 15 四月 2026 20:12:16 +0800
Subject: [PATCH] 页面
---
small-program/pages/mine/mine.vue | 909 +++++++++++++++++++-------------------------------------
1 files changed, 311 insertions(+), 598 deletions(-)
diff --git a/small-program/pages/mine/mine.vue b/small-program/pages/mine/mine.vue
index 0094782..2d37b3e 100644
--- a/small-program/pages/mine/mine.vue
+++ b/small-program/pages/mine/mine.vue
@@ -1,141 +1,68 @@
<template>
- <view class="index">
- <view class="index-c">
- <view :style="{ width: '100%', height: statusbarHeight + 'px' }"></view>
- <view class="index-c-title" :style="{ height: navHeight + 'px' }">
- <text class="index-c-title-logo">鎴戠殑</text>
- </view>
- <view class="info">
- <view class="info-box">
- <view class="info-box-head" >
- <view class="info-box-head-image" @click="jump(isLogin?1:5)">
- <image v-if="userInfo.fullCoverImage&&userInfo.fullCoverImage !=''" :src="userInfo.fullCoverImage" mode="widthFix"></image>
- <image v-else src="/static/icon/img@2x.png" mode="widthFix"></image>
- </view>
- <view class="info-box-head-info" v-if="isLogin">
- <view class="info-box-head-info-name" @click="jump(1)">{{userInfo.nickName||'鍖垮悕'}}</view>
- <view class="info-box-head-info-type" >
- <view class="info-box-head-info-type-val1" v-if="userInfo.useIdentity==1">鐢ㄥ伐鎺ュ崟鏂�</view>
- <view class="info-box-head-info-type-val" v-else>鐢ㄥ伐鍙戝竷鏂�</view>
- <!-- <view class="info-box-head-info-type-wz" @click="editUseIdentity">鍒囨崲</view> -->
- </view>
- </view>
- <view class="info-box-head-info" v-else @click="jump(5)">
- <view class="info-box-head-info-name">鐐瑰嚮鐧诲綍</view>
- <view class="info-box-head-info-type">
- <view class="info-box-head-info-type-wz">寰俊鎺堟潈鐧诲綍</view>
- </view>
- </view>
- <view class="info-box-head-qiehuan" @click="editUseIdentity">
- <image src="/static/icon/ic_change@2x.png" mode="widthFix"></image>
- <text>鍒囨崲韬唤</text>
- </view>
+ <view class="mine-page">
+ <view class="top-bg"></view>
+ <view class="nav-wrap">
+ <view :style="{ height: statusbarHeight + 'px' }"></view>
+ <view class="nav-bar" :style="{ height: navHeight + 'px' }">
+ <view class="nav-spacer"></view>
+ <view class="nav-actions">
+ <view class="nav-action-item">
+ <u-icon name="more-dot-fill" size="30" color="#222222"></u-icon>
</view>
- <view class="info-box-label">璐︽埛浣欓</view>
- <view class="info-box-price">
- <text>锟{isLogin?((userInfo.amount|| 0)/100).toFixed(2) :0.00}}</text>
- <view class="info-box-price-btn" @click="jump(isLogin?6:5)">鍘绘彁鐜�</view>
+ <view class="nav-divider"></view>
+ <view class="nav-action-item">
+ <u-icon name="scan" size="24" color="#222222"></u-icon>
</view>
</view>
</view>
- <view class="statistics">
- <view class="statistics-box" v-if="!isLogin || userInfo.useIdentity !=1">
- <view class="statistics-item" @click="jumpOrderList('0')" >
- <text>{{isLogin?(userInfo.userCenterVO.releaseTaskTotal||0):'-'}}</text>
- <text>鎬诲彂鍗曟暟</text>
+ </view>
+
+ <view class="page-scroll">
+ <view class="page-content">
+ <view class="profile-card">
+ <image class="avatar" src="/static/image/tx@2x.png" mode="widthFix"></image>
+ <view class="profile-copy">
+ <text class="login-text">{{ isLoggedIn ? maskedMobile : '鐐瑰嚮鐧诲綍' }}</text>
+ <text v-if="isLoggedIn" class="user-name">{{ userName }}</text>
</view>
- <view class="statistics-x"></view>
- <view class="statistics-item" @click="jumpOrderList('1')" >
- <text class="redtxt">{{isLogin?(userInfo.userCenterVO.waitReceiveTotal||0):'-'}}</text>
- <text>寰呮帴鍗�</text>
- </view>
- <view class="statistics-item" @click="jumpOrderList('2')" >
- <text>{{isLogin?(userInfo.userCenterVO.doingTotal||0):'-'}}</text>
- <text>杩涜涓�</text>
- </view>
- <view class="statistics-item" @click="jumpOrderList('3')" >
- <text>{{isLogin?(userInfo.userCenterVO.waitCommentTotal||0):'-'}}</text>
- <text>寰呰瘎浠�</text>
- </view>
- </view>
- <view class="statistics-box" v-else>
- <view class="statistics-item" @click="jumpOrderList('4')" >
- <text>{{isLogin?(userInfo.userCenterVO.receiveTotal||0):'-'}}</text>
- <text>宸叉帴鍗�</text>
- </view>
- <view class="statistics-x"></view>
- <view class="statistics-item" @click="jumpOrderList('5')">
- <text>{{isLogin?(userInfo.userCenterVO.taskingTotal||0):'-'}}</text>
- <text>杩涜涓�</text>
- </view>
- <view class="statistics-item" @click="jumpOrderList('6')">
- <text>{{isLogin?(userInfo.userCenterVO.doneTotal||0):'-'}}</text>
- <text>宸插畬鎴�</text>
- </view>
- </view>
- </view>
- <view class="guanggao">
- <view class="guanggao-image">
- <image src="/static/image/share@2x.png" mode="widthFix"></image>
- <button mode="widthFix"class='sharebtn' open-type="share"></button>
- </view>
- </view>
- <view class="paidan" v-if="isLogin && userInfo.useIdentity ==1">
- <view class="paidan-box">
- <view class="paidan-label">鎺ュ彈绯荤粺鑷姩娲惧崟</view>
- <view class="paidan-right">
- <text>鍏抽棴</text>
- <u-switch activeColor="#00BC12" @change="updateMemberInfo" v-model="autoReceiveStatus"></u-switch>
- </view>
- </view>
- </view>
- <view class="list">
- <view class="list-hz">
- <view class="list-hz-item"@click="jumpService(1)">
- <text>鏈嶅姟浠嬬粛</text>
- <u-icon name="arrow-right" color="#111111" size="18"></u-icon>
- </view>
- <view class="list-hz-item" @click="jumpService(2)">
- <text>鏀惰垂鏍囧噯</text>
- <u-icon name="arrow-right" color="#111111" size="18"></u-icon>
- </view>
- <view class="list-hz-item" @click="jump(isLogin?2:5)">
- <text>宸ヤ汉璧氶挶</text>
- <view class="list-hz-item-r">
- <text v-if="userInfo.workerIdentity === 2">宸茶璇�</text>
- <text class="orangetxt" v-else-if="userInfo.workerIdentity === 1">璁よ瘉涓�</text>
- <text class="redtxt" v-else-if="userInfo.workerIdentity === 3">璁よ瘉澶辫触</text>
- <text v-else>鍙帴鐢ㄥ伐璁㈠崟</text>
- <u-icon name="arrow-right" color="#111111" size="18"></u-icon>
+ <view v-if="isLoggedIn" class="profile-tools">
+ <view class="tool-item">
+ <image class="tool-icon" src="/static/icon/ic_option@2x.png" mode="aspectFit"></image>
+ </view>
+ <view class="tool-item has-badge">
+ <image class="tool-icon" src="/static/icon/ic_notice@2x.png" mode="aspectFit"></image>
+ <view class="tool-badge"></view>
</view>
</view>
- <view class="list-hz-item" @click="jump(isLogin?3:5)">
- <text>鍙告満璧氶挶</text>
- <view class="list-hz-item-r">
- <text v-if="userInfo.driverIdentity === 2">宸茶璇�</text>
- <text class="orangetxt" v-else-if="userInfo.driverIdentity === 1">璁よ瘉涓�</text>
- <text class="redtxt" v-else-if="userInfo.driverIdentity === 3">璁よ瘉澶辫触</text>
- <text v-else>鍙帴杩愯揣璁㈠崟</text>
- <u-icon name="arrow-right" color="#111111" size="18"></u-icon>
+ </view>
+
+ <view class="order-card section-card">
+ <view class="section-head">
+ <text class="section-title">鎴戠殑璁㈠崟</text>
+ <view class="more-wrap">
+ <text class="more-text">鍏ㄩ儴璁㈠崟</text>
+ <u-icon name="arrow-right" size="13" color="#999999"></u-icon>
</view>
</view>
- <view class="list-hz-item" @click="jump(isLogin?4:5)">
- <text>鎴戣兘渚涢</text>
- <view class="list-hz-item-r">
- <text v-if="userInfo.chefIdentity === 2">宸茶璇�</text>
- <text class="orangetxt" v-else-if="userInfo.chefIdentity === 1">璁よ瘉涓�</text>
- <text class="redtxt" v-else-if="userInfo.chefIdentity === 3">璁よ瘉澶辫触</text>
- <text v-else>鍙帴鐢ㄩ璁㈠崟</text>
- <u-icon name="arrow-right" color="#111111" size="18"></u-icon>
+ <view class="order-grid">
+ <view v-for="item in orderMenus" :key="item.label" class="order-item">
+ <image class="order-icon" :src="item.url" mode="widthFix"></image>
+ <view v-if="item.badge && isLoggedIn" class="order-badge">{{ item.badge }}</view>
+ <text class="order-label">{{ item.label }}</text>
</view>
- </view>
- <view class="list-hz-item" @click="jumpService(3)">
- <text>鍏充簬鎴戜滑</text>
- <u-icon name="arrow-right" color="#111111" size="18"></u-icon>
</view>
</view>
- <view class="setup-sub" v-if="isLogin" @click="logOffDo">閫�鍑虹櫥褰�</view>
- <view class="setup-sub" v-if="!isLogin" @click="jump(5)">鍘荤櫥褰�</view>
+
+ <view class="banner-card">
+ <image class="banner-image" src="/static/image/share@2x.png" mode="widthFix"></image>
+ </view>
+
+ <view class="menu-card section-card">
+ <view v-for="item in menuList" :key="item.label" class="menu-row">
+ <text class="menu-label">{{ item.label }}</text>
+ <u-icon name="arrow-right" size="18" color="#B5BBC5"></u-icon>
+ </view>
+ </view>
</view>
</view>
</view>
@@ -143,492 +70,278 @@
<script>
import { mapState } from 'vuex'
+
export default {
computed: {
- ...mapState(['navHeight', 'statusbarHeight','userInfo','token','openid'])
+ ...mapState(['navHeight', 'statusbarHeight']),
+ maskedMobile() {
+ if (!this.isLoggedIn || !this.mobile) {
+ return '鐐瑰嚮鐧诲綍'
+ }
+ return `${this.mobile.slice(0, 3)}****${this.mobile.slice(-4)}`
+ }
},
data() {
return {
- changing:false,
- changing1:false,
- autoReceiveStatus: false,
- isLogin:false,
- useIdentity:0,
- qrcode:''
+ isLoggedIn: true,
+ mobile: '18166669990',
+ userName: '钄″瓙鐟�',
+ orderMenus: [
+ { label: '寰呮敮浠�', url: '/static/icon/mine_ic_daifukuan@2x.png', badge: 12 },
+ { label: '寰呮敹璐�', url: '/static/icon/mine_ic_daishouhuo@2x.png', badge: 2 },
+ { label: '閫�娆�/鍞悗', url: '/static/icon/mine_ic_tuikuan@2x.png' }
+ ],
+ menuList: [
+ { label: '闂ㄥ簵鍏ラ┗' },
+ { label: '鎴戠殑闂ㄥ簵' },
+ { label: '瑙勮寖椤荤煡' },
+ { label: '鍦ㄧ嚎瀹㈡湇' },
+ { label: '鍏充簬鎴戜滑' }
+ ]
}
- },
- onShow(options){
- this.isLogin=false
- this.autoReceiveStatus=false;
- this.useIdentity =0
-
- if(this.token &&this.token!='' && this.userInfo && JSON.stringify(this.userInfo) != '{}'){
- this.isLogin=true
- this.getUserInfo()
- this.autoReceiveStatus = this.userInfo.autoReceiveStatus === 1
- this.useIdentity = this.userInfo.useIdentity
- }
- },
- methods: {
- jumpOrderList(flag){
- const app = getApp();
- app.globalData.orderStatus = flag;
- uni.switchTab({
- url: '/pages/demand-hall/demand-hall'
- })
- },
- getUserInfo() {
- var that = this;
- this.$u.api.getMemberInfo({}).then(res =>{
- if (res&&res.code ===200) {
- that.$store.commit('setUserInfo', res.data)
- that.$isResolve()
- }else{
- that.$store.commit('setToken','')
- that.$store.commit('setUserInfo',{})
- that.$isResolve()
- }
- })
- },
- jumpService(flag) {
- uni.navigateTo({
- url: '/pages/rich-text-page/rich-text-page?flag='+flag
- })
- },
- jump(type) {
- switch(type) {
- case 1:
- uni.navigateTo({
- url: '/packageA/pages/set-up/set-up'
- })
- break;
- case 2:
- if(!this.userInfo.workerIdentity ||this.userInfo.workerIdentity ==0){
- uni.navigateTo({
- url: '/packageA/pages/employment-certification/employment-certification?flag=0'
- })
- }else{
- uni.navigateTo({
- url: '/packageA/pages/certification-results/certification-results?flag=0'
- })
- }
- break;
- break;
- case 3:
- if(!this.userInfo.driverIdentity ||this.userInfo.driverIdentity ==0){
- uni.navigateTo({
- url: '/packageA/pages/employment-certification/employment-certification?flag=1'
- })
- }else{
- uni.navigateTo({
- url: '/packageA/pages/certification-results/certification-results?flag=1'
- })
- }
- break;
- case 4:
- if(!this.userInfo.chefIdentity ||this.userInfo.chefIdentity ==0){
- uni.navigateTo({
- url: '/packageA/pages/employment-certification/employment-certification?flag=2'
- })
- }else{
- uni.navigateTo({
- url: '/packageA/pages/certification-results/certification-results?flag=2'
- })
- }
- break;
- case 5:
- uni.navigateTo({
- url: '/pages/login/login'
- })
- break;
- case 6:
- uni.navigateTo({
- url: '/packageA/pages/withdrawal/withdrawal'
- })
- break;
- case 7:
- uni.navigateTo({
- url: '/packageA/pages/certification-results/certification-results'
- })
- break;
- }
- },
- logOffDo() {
- var that = this
- this.$u.api.logOff({}).then(res =>{
- //閫�鍑虹櫥褰曟垚鍔�
- that.isLogin =false
- that.$store.commit("empty")
- })
- } ,
- editUseIdentity() {
- if(this.changing1){
- return
- }
- this.changing1 = true
- var that = this
- var param ={useIdentity:this.userInfo.useIdentity==1?0:1}
- that.$u.api.editUseIdentity(param)
- .then(res =>{
- console.log(222,res)
- if(res.code ===200){
- that.userInfo.useIdentity = param.useIdentity
- that.$store.commit('setUserInfo', that.userInfo)
- uni.$emit('refresh')
- }
- }).finally(() => {
- that.changing1 = false
- })
- } ,
- saoyisao(){
- var that =this
- // 鍏佽浠庣浉鏈哄拰鐩稿唽鎵爜
- wx.scanCode({
- // scanType:['barCode'],
- success (res) {
- that.qrcode =res.result
- console.log(res)
- },
- fail(e){
- console.error(e)
- }
- })
- },
- updateMemberInfo(e) {
- if(this.changing){
- return
- }
- this.changing = true
- var that = this
- var param ={ autoReceiveStatus:that.autoReceiveStatus?1:0}
- this.$u.api.editMemberInfo(param).then(res =>{
- if(res.code ===200){
- that.userInfo.autoReceiveStatus = param.autoReceiveStatus
- }
- }).finally(() => {
- that.changing = false
- })
- }
}
}
</script>
-<style>
- page {
- background: #F7F7F7;
- }
-</style>
-
<style lang="scss" scoped>
- .index {
- width: 100%;
- .index-c {
- width: 100%;
- height: 520rpx;
- background: linear-gradient(#00BC12 0%, #00BC12 83%, #ffffff 100%);
- .list {
- width: 100%;
- padding: 0 30rpx;
- padding-bottom: 30px;
- box-sizing: border-box;
- .list-hz {
- width: 100%;
- padding: 0 30rpx;
- box-sizing: border-box;
- background: #FFFFFF;
- border-radius: 20rpx;
- overflow: hidden;
- .list-hz-item {
- width: 100%;
- height: 102rpx;
- display: flex;
- align-items: center;
- justify-content: space-between;
- border-bottom: 1rpx solid #E5E5E5;
- .list-hz-item-r {
- display: flex;
- align-items: center;
- text {
- font-weight: 400;
- font-size: 26rpx;
- color: #00BC12;
- margin-right: 20rpx;
- }
- }
- }
- }
- }
- .paidan {
- width: 100%;
- padding: 0 30rpx;
- box-sizing: border-box;
- margin-bottom: 20rpx;
- .paidan-box {
- width: 100%;
- height: 100rpx;
- background: #FFFFFF;
- border-radius: 20rpx;
- padding: 0 30rpx;
- box-sizing: border-box;
- display: flex;
- align-items: center;
- justify-content: space-between;
- .paidan-label {
- font-weight: 400;
- font-size: 30rpx;
- color: #222222;
- }
- .paidan-right {
- display: flex;
- align-items: center;
- text {
- font-weight: 400;
- font-size: 30rpx;
- color: #888888;
- margin-right: 20rpx;
- }
- }
- }
- }
- .guanggao {
- width: 100%;
- padding: 0 30rpx;
- box-sizing: border-box;
- margin-bottom: 20rpx;
- .guanggao-image {
- width: 100%;
- height: 140rpx;
- image {
- width: 100%;
- height: 100%;
- z-index: 999;
- }
- .sharebtn{
- position: relative;
- top: -150rpx;
- left: 0;
- outline:none;
- padding:0px;
- cursor: pointer;
- border: none;
- opacity: 0;
- width: 100%;
- height: 100%;
- z-index: 1000;
- }
- }
- }
- .statistics {
- width: 100%;
- padding: 0 30rpx;
- box-sizing: border-box;
- margin-bottom: 20rpx;
- .statistics-box {
- width: 100%;
- height: 168rpx;
- background: #FFFFFF;
- border-radius: 20rpx;
- display: flex;
- align-items: center;
- .statistics-x {
- width: 1rpx;
- height: 100rpx;
- border-right: 1rpx dashed #E5E5E5;
- }
- .statistics-item {
- flex: 1;
- height: 100%;
- display: flex;
- flex-direction: column;
- align-items: center;
- justify-content: center;
- text {
- &:nth-child(1) {
- font-weight: 600;
- font-size: 36rpx;
- color: #222222;
- }
- &:nth-child(2) {
- font-weight: 400;
- font-size: 26rpx;
- color: #888888;
- margin-top: 18rpx;
- }
- }
- }
- }
- }
- .info {
- width: 100%;
- padding: 30rpx;
- box-sizing: border-box;
- .info-box {
- width: 100%;
- height: 336rpx;
- padding: 40rpx;
- box-sizing: border-box;
- background: #FFFFFF;
- border-radius: 20rpx;
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- .info-box-price {
- width: 100%;
- display: flex;
- align-items: center;
- justify-content: space-between;
- text {
- font-weight: 600;
- font-size: 48rpx;
- color: #222222;
- }
- .info-box-price-btn {
- width: 148rpx;
- height: 60rpx;
- line-height: 60rpx;
- text-align: center;
- background: #00BC12;
- border-radius: 30rpx;
- font-weight: 500;
- font-size: 28rpx;
- color: #FFFFFF;
- }
- }
- .info-box-label {
- font-weight: 400;
- font-size: 26rpx;
- color: #888888;
- margin-bottom: 16rpx;
- }
- .info-box-head {
- width: 100%;
- height: 108rpx;
- display: flex;
- margin-bottom: 30rpx;
- .info-box-head-image {
- width: 108rpx;
- height: 100%;
- flex-shrink: 0;
- border-radius: 50%;
- display: flex;
- align-items: center;
- justify-content: center;
- overflow: hidden;
- margin-right: 24rpx;
- image {
- width: 100%;
- }
- }
- .info-box-head-qiehuan {
- flex-shrink: 0;
- display: flex;
- image {
- width: 32rpx;
- height: 32rpx;
- margin-right: 10rpx;
- }
- text {
- font-weight: 400;
- font-size: 28rpx;
- color: #00BC12;
- }
- }
- .info-box-head-info {
- flex: 1;
- height: 100%;
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- .info-box-head-info-name {
- font-weight: 600;
- font-size: 36rpx;
- color: #222222;
- }
- .info-box-head-info-type {
- width: 100%;
- display: flex;
- align-items: center;
- .info-box-head-info-type-val {
- width: 144rpx;
- height: 42rpx;
- line-height: 42rpx;
- text-align: center;
- background: rgba(253,158,36,0.06);
- border-radius: 8rpx;
- font-weight: 400;
- font-size: 24rpx;
- color: #FF7200;
- border: 2rpx solid #FD9E24;
- margin-right: 20rpx;
- }
- .info-box-head-info-type-val1 {
- width: 144rpx;
- height: 42rpx;
- line-height: 42rpx;
- text-align: center;
- background: rgba(91,190,56,0.06);
- border-radius: 8rpx;
- font-weight: 400;
- font-size: 24rpx;
- color: #00BC12;
- border: 2rpx solid #00BC12;
- margin-right: 20rpx;
- }
- .info-box-head-info-type-wz {
- font-weight: 400;
- font-size: 24rpx;
- color: #999999;
- }
- }
- }
- }
- }
-
- }
- .index-c-title {
- width: 100%;
- padding: 0 30rpx;
- box-sizing: border-box;
- display: flex;
- align-items: center;
- .index-c-title-logo {
- font-weight: bold;
- font-size: 36rpx;
- color: #FFFFFF;
- }
- .dingwei {
- width: 36rpx;
- height: 36rpx;
- margin-right: 8rpx;
- }
- .qu {
- width: 22rpx;
- height: 22rpx;
- }
- }
- }
+ .mine-page {
+ position: relative;
+ min-height: 100vh;
+ background: #f6f8fb;
}
- .setup-sub {
+
+ .top-bg {
+ position: absolute;
+ left: 0;
+ top: 0;
width: 100%;
- height: 88rpx;
- line-height: 88rpx;
- text-align: center;
- box-shadow: 0rpx 8rpx 12rpx 0rpx rgba(91,190,56,0.16);
- border-radius: 44rpx;
- font-weight: 500;
- font-size: 32rpx;
- color: #5BBE38;
- margin-top: 80rpx;
- border: 1rpx solid #15CF52;
- bottom: 50px;
+ height: 450rpx;
+ background: linear-gradient(180deg, #B9E9FF 0%, #ffffff 100%);
+ z-index: 0;
}
- .bluetxt{
- color:blue !important ;
- }
- .redtxt{
- color:#FF0000 !important ;
- }
- .orangetxt{
- color: #FF7200 !important ;
+
+ .nav-wrap,
+ .page-scroll {
+ position: relative;
+ z-index: 1;
+ }
+
+ .nav-bar {
+ padding: 0 16rpx;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ box-sizing: border-box;
+ }
+
+ .nav-spacer {
+ width: 52rpx;
+ height: 52rpx;
+ }
+
+ .nav-actions {
+ min-width: 112rpx;
+ height: 52rpx;
+ padding: 0 10rpx;
+ background: rgba(255, 255, 255, 0.86);
+ border-radius: 26rpx;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ box-sizing: border-box;
+ }
+
+ .nav-action-item {
+ width: 38rpx;
+ height: 38rpx;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+
+ .nav-divider {
+ width: 1rpx;
+ height: 24rpx;
+ background: #e5e7eb;
+ }
+
+ .page-content {
+ padding: 30rpx;
+ box-sizing: border-box;
+ }
+
+ .profile-card {
+ display: flex;
+ align-items: center;
+ margin-bottom: 30rpx;
+ }
+
+ .avatar {
+ width: 108rpx;
+ height: 108rpx;
+ border-radius: 50%;
+ overflow: hidden;
+ margin-right: 24rpx;
+ }
+
+ .login-text {
+ font-weight: 600;
+ font-size: 36rpx;
+ color: #111111;
+ }
+
+ .profile-copy {
+ flex: 1;
+ min-width: 0;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ }
+
+ .user-name {
+ margin-top: 12rpx;
+ font-weight: 400;
+ font-size: 26rpx;
+ color: #7d8792;
+ }
+
+ .profile-tools {
+ display: flex;
+ align-items: center;
+ gap: 20rpx;
+ }
+
+ .tool-item {
+ position: relative;
+ width: 40rpx;
+ height: 40rpx;
+ }
+
+ .tool-icon {
+ width: 100%;
+ height: 100%;
+ }
+
+ .tool-badge {
+ position: absolute;
+ right: -4rpx;
+ top: -4rpx;
+ width: 12rpx;
+ height: 12rpx;
+ border-radius: 50%;
+ background: #ff3b30;
+ }
+
+ .section-card {
+ background: #ffffff;
+ border-radius: 18rpx;
+ }
+
+ .order-card {
+ padding: 30rpx;
+ box-sizing: border-box;
+ }
+
+ .section-head {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 30rpx;
+ }
+
+ .section-title {
+ font-size: 34rpx;
+ font-weight: 600;
+ color: #222222;
+ }
+
+ .more-wrap {
+ display: flex;
+ align-items: center;
+ gap: 4rpx;
+ }
+
+ .more-text {
+ font-size: 24rpx;
+ color: #b5bbc5;
+ }
+
+ .order-grid {
+ display: flex;
+ align-items: center;
+ justify-content: space-around;
+ padding: 8rpx 14rpx 0;
+ }
+
+ .order-item {
+ position: relative;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ }
+
+ .order-badge {
+ position: absolute;
+ top: -6rpx;
+ right: -15rpx;
+ min-width: 28rpx;
+ height: 28rpx;
+ padding: 0 6rpx;
+ border-radius: 14rpx;
+ background: #ff2d55;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 18rpx;
+ line-height: 1;
+ color: #ffffff;
+ box-sizing: border-box;
+ }
+
+ .order-icon {
+ width: 60rpx;
+ height: 60rpx;
+ }
+
+ .order-label {
+ margin-top: 8rpx;
+ font-weight: 400;
+ font-size: 24rpx;
+ color: #333333;
+ }
+
+ .banner-card {
+ position: relative;
+ margin-top: 30rpx;
+ width: 100%;
+ overflow: hidden;
+ }
+
+ .banner-image {
+ width: 100%;
+ }
+
+ .menu-card {
+ margin-top: 30rpx;
+ padding: 0 30rpx;
+ box-sizing: border-box;
+ }
+
+ .menu-row {
+ height: 100rpx;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ border-bottom: 1rpx solid #E5E5E5;
+ }
+
+ .menu-row:last-child {
+ border-bottom: none;
+ }
+
+ .menu-label {
+ font-weight: 400;
+ font-size: 30rpx;
+ color: #222222;
}
</style>
--
Gitblit v1.9.3