mrr.sj.front/pages/artisan/profile.vue

853 lines
24 KiB
Vue
Raw Normal View History

<template>
<view class="profile-page">
<!-- 自定义顶部导航栏 -->
<view class="custom-navbar">
<!-- 左侧返回按钮和标题 -->
<view class="navbar-left">
<image class="back-icon"
src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/456f4e6c-e86a-42c9-a272-484db9af6c7c"
mode="aspectFit" @click="handleBack"></image>
<text class="navbar-title">我的资料</text>
</view>
<!-- 右侧状态栏 -->
<view class="navbar-right">
<!-- <view class="nav-status-item" @click="handleShareWechat">
<image class="nav-status-icon" src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/8a412688-b794-4407-bba6-a6dc65d75f08" mode="aspectFit"></image>
<text class="nav-status-text">分享到微信</text>
</view>
<view class="nav-status-item" @click="handleViewShop">
<image class="nav-status-icon" :src="identity == '2' ? 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/2b5de852-2d35-4786-a643-d20cabb3eaee' : 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/85638da9-804e-4811-8378-d1bb6007f99d'" mode="aspectFit"></image>
<text class="nav-status-text">{{ identity == '2' ? '查看店铺' : '查看手艺人' }}</text>
</view> -->
</view>
</view>
<!-- 内容区域 -->
<view class="content">
<!-- 基础资料部分 -->
<view class="section-card">
<view class="section-header">
<view class="title-bar"></view>
<text class="section-title">基础资料</text>
</view>
<text class="section-desc">店铺信息将影响顾客到店消费体验请确保信息准确</text>
<view class="subsection">
<view class="subsection-content">
<!-- 营业时间商家 / 服务时间手艺人 -->
<view class="info-item" @click="navigateToTimeSetting">
<view class="info-left">
<image class="item-icon"
src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/21f1efaf-0c17-49b0-a2b2-e0fd573b92b3"
mode="aspectFit"></image>
<text class="item-label">{{ identity == '2' ? '营业时间' : '服务时间' }}</text>
</view>
<view>
<image
src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/338d957b-cbb6-409b-9e7a-ef5faa0f9b70.png"
mode="widthFix"
2026-06-01 11:16:19 +08:00
style="width:26rpx;margin-top: 26rpx;position: relative;top: 4rpx;left: -10rpx;"
v-if="!userInfo.business_time">
</image>
2026-06-01 11:16:19 +08:00
<text style="margin-right: 16rpx;"
:style="{ color: userInfo.business_time ? '#c9c9c9' : '#ec5d57' }">
{{ userInfo.business_time ? '已设置' : '待完善' }}
</text>
<image class="arrow-right" src="/static/images/arrow_right.png" mode="aspectFit">
</image>
</view>
</view>
<view class="info-item" @click="navigateToServiceSkill">
<view class="info-left">
<image class="item-icon"
src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/b90e2322-a261-4c17-a581-85010c3bc112"
mode="aspectFit"></image>
<text class="item-label">服务技能</text>
</view>
<view>
<image
src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/338d957b-cbb6-409b-9e7a-ef5faa0f9b70.png"
mode="widthFix"
2026-06-01 11:16:19 +08:00
style="width:26rpx;margin-top: 26rpx;position: relative;top: 4rpx;left: -10rpx;"
v-if="!userInfo.servers_kill_arr || userInfo.servers_kill_arr.length === 0">
</image>
2026-06-01 11:16:19 +08:00
<text style="margin-right: 16rpx;"
2026-06-01 16:36:47 +08:00
:style="{ color: (userInfo.servers_kill_arr && userInfo.servers_kill_arr.length > 0) ? '#c9c9c9' : '#ec5d57' }">
2026-06-01 11:16:19 +08:00
{{ (userInfo.servers_kill_arr && userInfo.servers_kill_arr.length > 0) ? '已设置' :
'待完善' }}
</text>
<image class="arrow-right" src="/static/images/arrow_right.png" mode="aspectFit">
</image>
</view>
</view>
<!-- 门店信息 -->
<view class="info-item" v-if="identity == '2'" @click="navigateToShopInfo">
<view class="info-left">
<image class="item-icon"
src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/e9618006-db69-446e-92e1-ba9dd81e79f9"
mode="aspectFit"></image>
<text class="item-label">门店信息</text>
</view>
<image class="arrow-right" src="/static/images/arrow_right.png" mode="aspectFit"></image>
</view>
<!-- 服务区域手艺人显示 -->
<view class="info-item" v-if="identity == '1'" @click="navigateToServiceArea">
<view class="info-left">
<image class="item-icon"
src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/a35603b1-50fb-4248-9f2e-2dd4d5e249c0"
mode="aspectFit"></image>
<text class="item-label">服务区域</text>
</view>
<image class="arrow-right" src="/static/images/arrow_right.png" mode="aspectFit"></image>
</view>
<!-- 个人信息手艺人显示 -->
<view class="info-item" v-if="identity == '1'" @click="navigateToPersonalInfo">
<view class="info-left">
<image class="item-icon"
src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/77dc7a16-3b86-44e5-8acc-5f3b85ffc137"
mode="aspectFit"></image>
<text class="item-label">个人信息</text>
</view>
<image class="arrow-right" src="/static/images/arrow_right.png" mode="aspectFit"></image>
</view>
<!-- 个人信息手艺人显示 -->
<view class="info-item" @click="navigateToimg">
<view class="info-left">
<image class="item-icon"
src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/53a9d1e1-e2d2-4001-b599-82e0c0747f1a.png"
mode="aspectFit"></image>
<text class="item-label">相册管理</text>
</view>
<image class="arrow-right" src="/static/images/arrow_right.png" mode="aspectFit"></image>
</view>
<!-- 个人信息手艺人显示 -->
<view class="info-item" @click="navigateTovideo">
<view class="info-left">
<image class="item-icon"
src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/6fc821cd-8dd1-41f1-8854-889fb5f76b78.png"
mode="aspectFit"></image>
<text class="item-label">视频管理</text>
</view>
<image class="arrow-right" src="/static/images/arrow_right.png" mode="aspectFit"></image>
</view>
</view>
</view>
</view>
<!-- 经营资质部分 -->
<view class="section-card">
<view class="section-header">
<view class="title-bar"></view>
<text class="section-title">经营资质</text>
</view>
<view class="subsection-content">
<!-- 资质信息 -->
<view class="info-item" @click="navigateToQualification">
<view class="info-left">
<image class="item-icon"
src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/2677692c-5931-4ac7-846e-b6d321184789"
mode="aspectFit"></image>
<text class="item-label">资质信息</text>
</view>
<view>
<image
src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/338d957b-cbb6-409b-9e7a-ef5faa0f9b70.png"
mode="widthFix"
2026-06-01 11:16:19 +08:00
style="width:26rpx;margin-top: 26rpx;position: relative;top: 4rpx;left: -10rpx;"
v-if="userInfo.credentials_state === 0">
</image>
2026-06-01 11:16:19 +08:00
<text style="margin-right: 16rpx;"
:style="{ color: userInfo.credentials_state === 0 ? '#ec5d57' : userInfo.credentials_state === 1 ? '#e59e45' : '#c9c9c9' }">
{{ userInfo.credentials_state === 0 ? '待完善' : userInfo.credentials_state === 1 ? '审核中' :
'已认证' }}
</text>
<image class="arrow-right" src="/static/images/arrow_right.png" mode="aspectFit">
</image>
</view>
</view>
<!-- 所属门店手艺人显示 -->
<view class="info-item" v-if="identity == '1'" @click="navigateToBelongShop">
<view class="info-left">
<image class="item-icon"
src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/b5541cb5-58c1-4e72-b88f-5cf6450338a8"
mode="aspectFit"></image>
<text class="item-label">所属门店</text>
</view>
<image class="arrow-right" src="/static/images/arrow_right.png" mode="aspectFit"></image>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
2026-06-01 13:53:15 +08:00
import {
handleImgSizeUni
} from '@/utils/service.js'
import request from "../../utils/request";
export default {
data() {
return {
identity: '',
currentUserId: '', // 当前用户ID
userInfo: {}, // 用户信息
sharing: false // 添加分享状态标记
}
},
onLoad() {
// 页面显示时重新加载身份信息,确保数据最新
this.loadIdentity()
console.log('当前身份:', this.identity)
// 加载用户信息
this.loadUserInfo()
},
2026-06-01 13:53:15 +08:00
onShow() {
// 页面显示时也重新加载,确保数据最新
this.loadIdentity()
this.loadUserInfo()
},
methods: {
// 返回按钮处理
handleBack() {
uni.navigateBack()
},
// 分享到微信
handleShareWechat() {
console.log('分享到微信')
this.handleShareProcess()
},
async handleShareProcess() {
// 如果正在分享中,防止重复点击
if (this.sharing) {
return;
}
2026-06-01 13:53:15 +08:00
// 设置分享状态
this.sharing = true;
2026-06-01 13:53:15 +08:00
try {
// 显示加载提示
uni.showLoading({
title: '正在准备分享...',
mask: true
});
2026-06-01 13:53:15 +08:00
// 确保用户信息已加载
if (!this.currentUserId) {
await this.loadUserInfo()
}
2026-06-01 13:53:15 +08:00
// 检查是否已加载用户信息
if (!this.currentUserId) {
uni.showToast({
title: '无法获取用户信息',
icon: 'none'
})
return
}
2026-06-01 13:53:15 +08:00
// 根据环境处理
// #ifdef APP-PLUS
this.handleAppAutoShare()
// #endif
2026-06-01 13:53:15 +08:00
// #ifdef MP-WEIXIN
this.handleMpAutoShare()
// #endif
2026-06-01 13:53:15 +08:00
// #ifdef H5
this.handleH5Share()
// #endif
} catch (error) {
console.error('分享过程出错:', error);
uni.hideLoading();
this.sharing = false;
uni.showToast({
2026-06-01 13:53:15 +08:00
title: '分享失败,请重试',
icon: 'none'
2026-06-01 13:53:15 +08:00
});
}
2026-06-01 13:53:15 +08:00
},
2026-06-01 13:53:15 +08:00
// H5环境分享
handleH5Share() {
// 在H5环境通常使用浏览器的分享功能或复制链接
const shareUrl = window.location.href
uni.showModal({
title: '分享提示',
// content: `请复制链接分享给好友:${shareUrl}`,
content: `请在美融融Plus APP 环境下使用此功能`,
2026-06-01 13:53:15 +08:00
showCancel: false,
confirmText: '好的',
success: (res) => {
if (res.confirm) {
// // 复制链接到剪贴板
// uni.setClipboardData({
// data: shareUrl,
// success: () => {
// uni.showToast({
// title: '链接已复制',
// icon: 'success'
// })
// }
// })
}
}
2026-06-01 13:53:15 +08:00
})
},
2026-06-01 13:53:15 +08:00
// 小程序环境处理
handleMpAutoShare() {
// 小程序无法自动触发分享,跳转后提示用户手动操作
const url = this.identity == '2' ?
`/pages/user/store-detail?id=${this.currentUserId}` :
`/pages/user/syr-detail?id=${this.currentUserId}`;
uni.navigateTo({
url: url,
success: () => {
setTimeout(() => {
uni.showToast({
title: '请点击右上角分享',
icon: 'none',
duration: 2000
});
}, 500);
}
});
},
// APP环境自动分享
handleAppAutoShare() {
if (!this.currentUserId) {
uni.showToast({
title: '无法获取用户信息',
icon: 'none'
});
return;
}
2026-06-01 13:53:15 +08:00
// 清除旧的分享标记
uni.removeStorage({
key: 'share_success'
2026-06-01 11:16:19 +08:00
});
2026-06-01 13:53:15 +08:00
// 跳转到店铺主页并自动触发分享
const url = this.identity == '2' ?
`/pages/user/store-detail?id=${this.currentUserId}&autoShare=1` :
`/pages/user/syr-detail?id=${this.currentUserId}&autoShare=1`;
uni.navigateTo({
url: url,
success: () => {
console.log('跳转成功,将自动触发分享');
// 跳转成功后立即隐藏loading避免页面闪烁
setTimeout(() => {
uni.hideLoading();
this.sharing = false;
}, 200);
},
fail: () => {
console.log('跳转失败:', err);
2026-06-01 11:16:19 +08:00
uni.hideLoading();
this.sharing = false;
2026-06-01 13:53:15 +08:00
this.showManualShareOption();
}
});
},
// 执行APP分享
executeAppShare(imageUrl) {
// 备用图片地址
const backupImageUrl =
"https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/yh/1756713709528-717.png?x-oss-process=image/resize,p_40"
// 根据身份设置不同的分享标题
const shareTitle = this.identity == '2' ?
"好友刚推了个超赞商家点开认识TA ~" :
"好友刚推了个超赞手艺人点开认识TA ~"
// 生成分享配置
const shareConfig = {
provider: "weixin",
scene: "WXSceneSession",
type: 5,
title: shareTitle,
miniProgram: {
id: "gh_89c92e18b70b", // 小程序原始ID
path: this.getSharePath(), // 动态分享路径
type: 0, // 正式版
webUrl: "https://www.baidu.com/", // 降级网页地址
},
imageUrl: imageUrl,
success: (res) => {
console.log("分享成功:", JSON.stringify(res))
2026-06-01 11:16:19 +08:00
uni.showToast({
2026-06-01 13:53:15 +08:00
title: '分享成功',
icon: 'success'
2026-06-01 11:16:19 +08:00
})
2026-06-01 13:53:15 +08:00
},
fail: (err) => {
console.log("分享失败:", JSON.stringify(err))
// 尝试使用备用图片
if (imageUrl !== backupImageUrl) {
console.log("尝试使用备用图片分享...")
this.executeAppShare(backupImageUrl)
} else {
uni.showToast({
title: '分享失败',
icon: 'none'
})
}
2026-06-01 11:16:19 +08:00
}
}
2026-06-01 13:53:15 +08:00
// 检查是否支持分享API
if (uni.share) {
uni.share(shareConfig)
} else {
uni.showToast({
title: '当前环境不支持分享',
icon: 'none'
})
}
},
// 获取分享路径
getSharePath() {
// 根据身份生成不同的分享路径
if (this.identity == '2') {
// 商家分享店铺详情页
return `/pages/user/store-detail?id=${this.currentUserId || ''}`
} else {
// 手艺人分享个人主页
return `/pages/user/syr-detail?id=${this.currentUserId || ''}`
}
},
2026-06-01 13:53:15 +08:00
// 查看店铺
async handleViewShop() {
console.log('查看店铺')
2026-06-01 13:53:15 +08:00
// 确保用户信息已加载
if (!this.currentUserId) {
await this.loadUserInfo()
}
2026-06-01 11:16:19 +08:00
2026-06-01 13:53:15 +08:00
// 如果仍然没有用户ID提示用户手动输入或联系客服
if (!this.currentUserId) {
uni.showModal({
title: '提示',
content: '无法获取用户信息,请联系客服或稍后重试',
showCancel: false,
confirmText: '确定'
})
return
}
2026-06-01 13:53:15 +08:00
// 根据身份跳转到不同的页面
if (this.identity == '2') {
// 商家跳转到店铺主页
uni.navigateTo({
url: '/pages/user/store-detail?id=' + this.currentUserId
})
} else {
// 手艺人跳转到个人主页
uni.navigateTo({
url: '/pages/user/syr-detail?id=' + this.currentUserId
})
}
2026-06-01 13:53:15 +08:00
},
// 加载用户信息 - 主要使用接口获取
async loadUserInfo() {
try {
// 根据身份设置type参数参考个人中心页面的逻辑
let type = 1 // 默认值
if (this.identity == '1') {
type = 2 // 手艺人
} else if (this.identity == '2') {
type = 3 // 商家
}
2026-06-01 13:53:15 +08:00
console.log('调用接口获取用户信息type:', type)
2026-06-01 13:53:15 +08:00
// 调用接口获取用户信息
const result = await request.post('/sj/user/getUser', {
type
})
2026-06-01 13:53:15 +08:00
if (result.data && result.data.id) {
this.userInfo = result.data
this.currentUserId = result.data.id
2026-06-01 11:16:19 +08:00
2026-06-01 13:53:15 +08:00
// 存储到本地,避免重复调用
uni.setStorageSync('userInfo', result.data)
console.log('从接口获取用户信息成功:', this.userInfo)
} else {
console.log('接口返回数据异常:', result)
}
} catch (error) {
console.log('获取用户信息失败:', error)
// 降级方案尝试从其他可能的位置获取用户ID
this.tryAlternativeUserInfo()
uni.hideLoading();
}
2026-06-01 13:53:15 +08:00
},
// 备用方案:从其他位置获取用户信息
tryAlternativeUserInfo() {
try {
const app = getApp()
// 方法1: 从全局数据获取用户ID
if (app.globalData.userInfo && app.globalData.userInfo.id) {
this.currentUserId = app.globalData.userInfo.id
this.userInfo = app.globalData.userInfo
console.log('从全局数据获取用户ID:', this.currentUserId)
return
}
2026-06-01 13:53:15 +08:00
// 方法2: 从本地存储获取完整的用户信息
const userInfo = uni.getStorageSync('userInfo')
if (userInfo && userInfo.id) {
this.currentUserId = userInfo.id
this.userInfo = userInfo
console.log('从存储获取用户ID:', this.currentUserId)
return
}
2026-06-01 11:16:19 +08:00
2026-06-01 13:53:15 +08:00
// 方法3: 直接获取用户ID
const userId = uni.getStorageSync('userId')
if (userId) {
this.currentUserId = userId
console.log('从存储获取用户ID:', userId)
return
}
2026-06-01 13:53:15 +08:00
console.log('所有获取用户信息的方法都失败了')
} catch (e) {
console.log('备用方案获取用户信息失败:', e)
}
2026-06-01 13:53:15 +08:00
},
2026-06-01 13:53:15 +08:00
loadIdentity() {
// 从全局数据获取身份
const app = getApp()
const globalIdentity = app.globalData.artisanType
console.log('从全局数据获取身份:', globalIdentity)
2026-06-01 13:53:15 +08:00
if (globalIdentity) {
this.identity = globalIdentity
uni.setStorageSync('user_identity', globalIdentity)
} else {
// 如果全局数据没有,尝试从本地存储获取
const localIdentity = uni.getStorageSync('user_identity')
if (localIdentity) {
this.identity = localIdentity
console.log('从本地存储获取身份:', localIdentity)
} else {
console.log('未获取到身份信息')
// 默认设为手艺人
this.identity = '1'
}
}
2026-06-01 13:53:15 +08:00
console.log('当前身份:', this.identity)
},
2026-06-01 11:16:19 +08:00
2026-06-01 13:53:15 +08:00
navigateToTimeSetting() {
if (this.identity == '2') {
// 商家跳转到营业时间页面
uni.navigateTo({
url: '/pages/shop/business-time'
})
} else {
2026-06-01 13:53:15 +08:00
// 手艺人跳转到服务时间页面
uni.navigateTo({
url: '/pages/artisan/service-time'
})
}
2026-06-01 13:53:15 +08:00
},
2026-06-01 13:53:15 +08:00
navigateToServiceSkill() {
if (this.identity == '2') {
// 商家跳转到商家服务技能页面
uni.navigateTo({
url: '/pages/shop/service-skills'
})
} else {
// 手艺人跳转到手艺人服务技能页面
uni.navigateTo({
url: '/pages/artisan/service-skills'
})
}
},
2026-06-01 13:53:15 +08:00
navigateToShopInfo() { // 商家:门店信息
uni.navigateTo({
2026-06-01 13:53:15 +08:00
url: '/pages/shop/sj-info-change'
})
2026-06-01 13:53:15 +08:00
},
navigateToServiceArea() { // 手艺人:服务区域
uni.navigateTo({
2026-06-01 13:53:15 +08:00
url: '/pages/artisan/service-area'
})
2026-06-01 13:53:15 +08:00
},
2026-06-01 13:53:15 +08:00
navigateToPersonalInfo() { // 手艺人:个人信息
uni.navigateTo({
2026-06-01 13:53:15 +08:00
url: '/pages/artisan/syr-info-change'
})
2026-06-01 13:53:15 +08:00
},
navigateToimg() { // 图片管理
uni.navigateTo({
2026-06-01 13:53:15 +08:00
url: '/pages/shop/photoAlbum/photoManage?type=1'
})
2026-06-01 13:53:15 +08:00
},
2026-06-01 13:53:15 +08:00
navigateTovideo() { // 视频管理
2026-06-01 11:16:19 +08:00
uni.navigateTo({
2026-06-01 13:53:15 +08:00
url: '/pages/shop/photoAlbum/photoManage?type=2'
2026-06-01 11:16:19 +08:00
})
2026-06-01 13:53:15 +08:00
},
2026-06-01 16:36:47 +08:00
navigateToQualification() {
2026-06-01 17:27:11 +08:00
const state = this.userInfo.credentials_state;
if (state === 1) {
// === 1. 审核中 ===
// 跳转到最新确认的专属进度/客服二维码页面
uni.navigateTo({
url: '/pages/ruzhu/submitres'
});
} else if (state === 0) {
// === 2. 待完善 / 被驳回 ===
// 同步首页逻辑:判断是老手还是纯新手
if (this.userInfo.id_type !== 0) {
// 已经开启过入驻,直接空降到最后一步(门店信息)
uni.navigateTo({
url: '/pages/ruzhu/ruzhu?step=3'
});
} else {
// 完全没入驻过的纯新手,老老实实从第一步开始
uni.navigateTo({
url: '/pages/ruzhu/ruzhu'
});
}
} else {
// === 3. 已认证 ===
// 跳转到资质信息的查看/修改页面
uni.navigateTo({
url: '/pages/shop/qualification_sj_change'
});
}
},
2026-06-01 13:53:15 +08:00
navigateToBelongShop() { // 手艺人:所属门店
2026-06-01 11:16:19 +08:00
uni.navigateTo({
2026-06-01 13:53:15 +08:00
url: '/pages/artisan/belong_shop'
2026-06-01 11:16:19 +08:00
})
}
}
}
2026-06-01 11:16:19 +08:00
</script>
2026-06-01 11:16:19 +08:00
<style>
2026-06-01 13:53:15 +08:00
.profile-page {
min-height: 100vh;
background-color: #f5f5f5;
}
/* 自定义导航栏样式 */
.custom-navbar {
position: fixed;
top: 0;
left: 0;
right: 0;
height: 108rpx;
/* 使用标准导航栏高度 */
background: white;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 32rpx;
z-index: 999;
box-sizing: border-box;
/* 适配不同机型的顶部安全区域 */
padding-top: var(--status-bar-height);
height: calc(128rpx + var(--status-bar-height));
}
/* 导航栏左侧 */
.navbar-left {
display: flex;
align-items: center;
}
.back-icon {
width: 16rpx;
height: 32rpx;
margin-right: 23rpx;
}
.navbar-title {
font-family: PingFangSC, PingFang SC;
font-weight: 500;
font-size: 32rpx;
color: #333333;
line-height: 45rpx;
text-align: left;
font-style: normal;
}
/* 导航栏右侧状态栏 */
.navbar-right {
display: flex;
align-items: center;
}
.nav-status-item {
display: flex;
flex-direction: column;
align-items: center;
margin-left: 11rpx;
padding: 16rpx;
}
.nav-status-icon {
width: 44rpx;
height: 44rpx;
margin-bottom: 7rpx;
}
.nav-status-text {
font-family: PingFangSC, PingFang SC;
font-weight: 400;
font-size: 20rpx;
color: #333333;
line-height: 28rpx;
text-align: left;
font-style: normal;
}
.content {
padding: 20rpx;
/* 动态计算内容区域的上边距 */
padding-top: calc(128rpx + var(--status-bar-height) + 20rpx);
}
/* 部分卡片 */
.section-card {
background: white;
border-radius: 20rpx;
padding: 20rpx 20rpx 0 20rpx;
margin-bottom: 20rpx;
}
.section-header {
display: flex;
align-items: center;
margin-bottom: 8rpx;
}
.section-title {
font-family: PingFangSC, PingFang SC;
font-weight: 500;
font-size: 32rpx;
color: #1D2129;
line-height: 48rpx;
text-align: left;
font-style: normal;
}
.title-bar {
width: 6rpx;
height: 30rpx;
2026-06-02 11:39:23 +08:00
background-color: #FF4767;
2026-06-01 13:53:15 +08:00
margin-right: 10rpx;
border-radius: 5rpx;
}
.section-desc {
font-family: PingFangSC, PingFang SC;
font-weight: 400;
font-size: 24rpx;
color: #666666;
line-height: 33rpx;
text-align: left;
font-style: normal;
margin-left: 20rpx;
letter-spacing: 0.5rpx;
}
/* 子部分 */
.subsection {
/* margin-top: 10rpx; */
/* margin-left: 17rpx; */
}
.subsection-content {
border-radius: 12rpx;
overflow: hidden;
margin-left: 17rpx;
}
/* 信息项 */
.info-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 32rpx 0;
border-bottom: 1rpx solid #f0f0f0;
}
.info-item:last-child {
border-bottom: none;
}
.info-left {
display: flex;
align-items: center;
}
.item-icon {
width: 48rpx;
height: 48rpx;
margin-right: 24rpx;
}
.item-label {
font-family: PingFangSC, PingFang SC;
font-weight: 500;
font-size: 28rpx;
color: #333333;
line-height: 40rpx;
text-align: left;
font-style: normal;
}
.arrow-right {
margin-right: 19rpx;
width: 11rpx;
height: 22rpx;
}
2026-03-24 11:45:13 +08:00
</style>