<template>
	<view class="my-page">
		<!-- 顶部导航栏 -->
		<!-- <custom-navbar
      title="我的"
      :show-back="false"
      title-color="#333333"
      :backgroundColor="backgroundColor"
    ></custom-navbar> -->

		<!-- 用户信息区域 -->
		<view class="user-section" v-if="isLogin">
			<view class="user-info">
				<view class="user-info-left">
					<view class="avatar">
						<image :src="!userInfo.head_photo ? baseAvartar : userInfo.head_photo" mode="aspectFill"
							class="avatar-img"></image>
						<button class="avatar-button"></button>
						<!-- open-type="chooseAvatar" -->
						<!-- @chooseavatar="getAvatar" -->
					</view>

					<view class="user-detail" @click="goToProfile">
						<view class="nickname">
							<text class="nickname-text">{{
								userInfo.name || userInfo.nick_name || ""
							}}</text>
						</view>
						<view class="user_detail_tip">
							<view class="user_detail_tip_phone" v-if="id_type !== 0">
								资料编辑
								<image mode="aspectFill"
									src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/6a4b7bc9-174a-471a-9bf5-6ba167005960" />
							</view>
							<view v-else class="user_detail_tip_phone" style="color: #999999">美融融小程序欢迎您</view>
						</view>
					</view>
				</view>
				<view class="user-info-right" @click="goToWallet">
					<view class="wallet_content">
						<image
							src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/931c0992-5243-4c70-ab2b-b99b430661c8.png"
							mode="aspectFill" class="wallet_content_img"></image>
						<view class="wallet_content_text">钱包余额：<text style="color: #e8101e">{{ userInfo.money }}元</text>
						</view>
					</view>
				</view>
			</view>
			<view class="authentication" v-if="id_type == 2 && !isBind">
				<view @click="goTypeSelect" class="authentication_content">
					<image mode="aspectFill" class="authentication_img"
						src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/ed8bc685-33bd-48cf-8058-85b07b9be0dc.png" />
					<view class="authentication_text">申请成为平台商家</view>
				</view>
			</view>
			<view class="inviteMessage" v-if="inviteList.length > 0">
				<view class="inviteMessage_content">
					<image mode="widthFix" class="inviteMessage_img"
						src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/bb9d15ac-ece5-4481-ae30-62f76ace032f.png" />
					<view class="inviteMessage_text">您有{{ inviteList.length }}条商家邀请</view>
				</view>
				<image @click="goToInviteList" mode="aspectFill" class="btn_img"
					src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/defe90dd-3e35-4582-ad45-b36f68681bcc.png" />
			</view>
		</view>
		<!-- 用户相关信息 -->
		<view class="user-section" v-else>
			<view class="user-info">
				<view class="user-info-left" @click="goLogin">
					<image
						src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/4b48d973-d219-4cac-b206-675c192d0cff"
						mode="aspectFill" class="avatar"></image>
					<view class="user-detail">
						<text class="nickname"> 请点击登录 </text>
						<text class="user-detail-tip">美融融商家欢迎您</text>
					</view>
				</view>
			</view>
		</view>

		<view class="order-card">
			<template v-for="card in currentCardList">
				<view class="function-list" v-if="card.type == 'line'">
					<view class="function-title">{{ card.title }}</view>
					<view class="function-grid">
						<view class="grid-item" v-for="(item, index) in card.list" :key="index"
							@click="handleFunction(item)">
							<view class="icon-wrapper">
								<image :src="item.icon" class="grid-icon" mode="widthFix"></image>
							</view>
							<text class="grid-text">{{ item.text }}</text>
						</view>
					</view>
				</view>
				<view class="function-list" style="padding: 24rpx; padding-bottom: 28rpx"
					v-if="card.type == 'lineCard'">
					<view class="lineCard-title">{{ card.title }}</view>
					<view class="lineCard-grid">
						<image v-for="(item, index) in card.list" :src="item.url" mode="widthFix"
							@click="handleFunction(item)"></image>
					</view>
				</view>
				<view class="imagePure" v-if="card.type == 'imagePure'">
					<image @click="handleFunction(card)" :src="card.url" mode="widthFix"></image>
				</view>
				<view class="image-list" v-if="card.type == 'image'">
					<view class="image-title">{{ card.title }}</view>
					<image @click="handleFunction(card)" :src="card.url" mode="widthFix"></image>
				</view>
				<view class="listcard-list" v-if="card.type == 'listcard'">
					<view class="function-title">{{ card.title }}</view>
					<view class="listcard-item" v-for="(item, index) in card.list" :key="index">
						<image @click="handleFunction(item)" :src="item.url" mode="widthFix"></image>
						<view class="listcard-title">{{ item.title }}</view>
						<view class="listcard-text">{{ item.text }}</view>
					</view>
				</view>
				<view class="imageText-list" v-if="card.type == 'imageText'">
					<view class="lineCard-title">{{ card.title }}</view>
					<view class="imageText-content">
						<image :src="card.url" mode="widthFix"></image>
						<view class="text-status">入驻成功啦！</view>
						<view class="text-next">下一步:等待<text style="color: #e8101e">专属门店商家邀约绑定</text>，解锁订单资源与服</view>
						<view class="text-next">务通道，开启高效变现、共创共赢的新旅程～</view>
					</view>
				</view>
			</template>
		</view>

		<tipsPopup2 :show="tipShow" @closePopup="closePopup" sureText="确认" @okBtn="okBtn">
			{{ tipsText }}
		</tipsPopup2>
		<TabBar :selected="2"></TabBar>
	</view>
</template>

<script>
import TabBar from "@/components/tabbar/tabbar.vue"
import tipsPopup2 from "@/components/tips-popup/tips-popup2";
import CustomNavbar from "@/components/custom-navbar/custom-navbar.vue";
import request from "@/utils/request";
export default {
	components: {
		CustomNavbar,
		tipsPopup2,
		TabBar
	},
	data() {
		return {
			tipType: "", //提示弹窗类型
			userInfo: {},
			baseAvartar: "https://app.mrrweb.com.cn" + "/public/images/headanimal.png",
			cardList: [{
				type: "image",
				title: "基础功能",
				id_type: 0,
				url: "https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/aa9fa8d6-8d85-4dce-875a-e71e02595198.png",
				path: "/pages/ruzhu/ruzhu",
			},
			{
				type: "lineCard",
				title: "管理中心",

				list: [{
					title: "员工管理",
					url: "https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/9d847e84-e4ca-44c0-b9fb-e33803a67457.png",
					path: "/pages/shop/staff/manage",
					go_id_type: 1,
				},
				{
					title: "服务分配",
					url: "https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/0d27ea76-2a81-4374-8033-5eef76598f9c.png",
					path: "/pages/shop/staff/distribution-service",
					go_id_type: 1,
				},
				{
					title: "店铺装修",
					url: "https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/4b558456-2e38-4185-8713-d1f0e6645820.png",
					// https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/e6e72039-eec4-414c-8a86-aad404602962.png
					path: "/pages/shop/staff/distribution-service",
					go_id_type: 1,
				},
				{
					title: "财务管理",
					url: "https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/edafae37-8258-4e1c-9dcc-019484117047.png",
					path: "/pages/shop/staff/distribution-service",
					go_id_type: 1,
				},
				],
			},
			{
				type: "lineCard",
				title: "交易项目",

				list: [{
					title: "服务管理",
					path: "/pages/artisan/service-list",
					go_id_type: 1,
					url: "https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/0076bdee-f1c6-412d-9f05-187189a855a6.png",
				},
				{
					title: "工位管理",
					path: "/pages/shop/workSpace/list",
					go_id_type: 1,
					url: "https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/6568df0b-e646-4593-804b-a21ed0b35ede.png",
				},
				{
					title: "购买服务",
					path: "/pages/shop/buy-service",
					go_id_type: 1,
					url: "https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/6c9aa5ea-63aa-4a86-8858-cb58d303114f.png",
				},
				{
					title: "购买工时",
					path: "/pages/shop/manHour/buyManHour",
					go_id_type: 1,
					url: "https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/c40cddcb-6a43-4355-b25d-ab3e53e17982.png",
				},
				],
			},
			{
				type: "lineCard",
				title: "交易订单",

				list: [{
					title: "用户订单",
					path: "/pages/shop/userorders",
					go_id_type: 1,
					url: "https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/b94e033c-836b-404c-85e9-9a7ba7680919.png",
				},
				{
					title: "工位订单",
					path: "/pages/shop/workSpace/saleList",
					go_id_type: 1,
					url: "https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/b5ede46f-71f9-4718-87a8-3aa4ba99c490.png",
				},
				{
					title: "服务订单",
					path: "/pages/shop/buy-order",
					go_id_type: 1,
					url: "https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/673f1dac-1693-4f0a-aec4-c196aa72382b.png",
				},
				{
					title: "购买工时",
					path: "/pages/shop/manHour/saleList",
					go_id_type: 1,
					url: "https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/72520b2a-804c-4987-84ca-25e5247e65a2.png",
				},
				],
			},
			{
				type: "lineCard",
				title: "营销中心",

				list: [{
					title: "拼团管理",
					path: "/pages/shop/groupBuying/list",
					go_id_type: 1,
					url: "https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/569c2ba5-2f39-4a3f-b36d-026c480d8203.png",
				},
				{
					title: "日常推广",
					path: "/pages/promotion/promotion",
					go_id_type: 1,
					url: "https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/90d92ff7-4110-4ebd-8207-e6370699a1b6.png",
				},
				],
			},
			{
				type: "lineCard",
				title: "平台自营项目",
				id_type: 1,
				self_state: true,
				list: [{
					text: "自营服务",
					url: "https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/fa0c9545-91f4-4a73-b5fe-fa1217aa768e.png",
					path: "/pages/selfOperated/list",
				},
				{
					text: "自营订单",
					url: "https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/dfeff761-7448-4f31-a4e9-ee12b088d6a8.png",
					path: "/pages/shop/userorders?serviceType=2",
				},
				],
			},
			{
				type: "imagePure",
				title: "",
				id_type: 1,
				self_state: false,
				url: "https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/30b42fe6-21f9-443f-a091-5439d57e3593.png",
				path: "/pages/selfOperated/agreement?title=平台自营项目介绍&type=18",
			},
			{
				type: "listcard",
				title: "我的服务",
				list: [
					{
						text: "我的收藏",
						url: "https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/83fa7f51-dda3-494b-a50e-f15f8fdcdb9c.png",
						path: "/pages/my/myFavorite",
					},
					{
						text: "设置",
						url: "https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/d1173680-386b-4db3-a74c-64108da6cec9.png",
						path: "/pages/settings/index",
					},
					{
						text: "联系客服",
						url: "https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/5bbac7f8-940a-414a-be0b-e6faf5215f63.png",
						path: "/pages/contact/contact",
					},
				],
			},
			],

			isLogin: false,
			tipsText: "",
			tipShow: false,
			scrollTop: 0,
			inviteList: [],
			// 账号停用弹窗控制
			stopUseModal: false,
		};
	},
	onPageScroll(e) {
		this.scrollTop = e.scrollTop;
	},
	computed: {
		id_type() {
			return this.userInfo?.id_type || 0;
		},
		isBind() {
			return this.userInfo.bind_count > 0;
		},

		// 判断是否账号已停止使用
		isAccountDisabled() {
			return this.userInfo?.is_ok === 2;
		},

		currentCardList() {
			return this.cardList
				.filter((card) => this.checkShow(card))
				.map((item) => ({
					...item,
					list: item.list?.filter((card) => this.checkShow(card)),
				}));
		},
		backgroundColor() {
			if (this.scrollTop > 10) {
				return `rgba(255, 255, 255, ${0.02 * this.scrollTop});`;
			}
			return "transparent";
		},
	},
	onLoad() {
		uni.hideTabBar();
		const systemInfo = uni.getSystemInfoSync();
		const statusBarHeight = systemInfo.statusBarHeight;
		// 导航栏主体高度：iOS一般44px，Android一般48px（可自定义）
		const navMainHeight = systemInfo.platform === "ios" ? 44 : 48;
		// 绑定2个CSS变量：状态栏高度、导航栏主体高度
		this.cssVars = {
			"--status-bar-height": `${statusBarHeight}px`,
			"--nav-main-height": `${navMainHeight}px`,
		};
	},
	onShow() {
		this.isLogin = uni.getStorageSync("accessToken") ? true : false;
		if (!this.isLogin) { } else {
			// 获取用户信息
			this.getUserInfo();
		}
	},
	methods: {
		// 检查是否允许访问的方法
		checkAccess(item) {
			// 如果账号未停止使用，允许访问所有
			if (!this.isAccountDisabled) {
				return true;
			}

			// 账号已停止使用时，只允许特定的路径访问
			// 允许访问的路径列表
			const allowedPaths = [
				"/subPackages/other/contact/contact", // 联系平台
			];

			const allowedTypes = ["logout"]; // 退出登录

			// 检查是否在允许列表中
			if (item.type && allowedTypes.includes(item.type)) {
				return true;
			}

			if (item.path && allowedPaths.includes(item.path)) {
				return true;
			}

			// 其他情况不允许访问
			this.showStopUseModal();
			return false;
		},

		// 显示账号停用提示
		showStopUseModal() {
			uni.showModal({
				title: "提示",
				content: "您的账号已停止使用。若有疑问或恢复需求，请尽快联系平台工作人员核实处理。",
				showCancel: false,
				confirmText: "我知道了",
			});
		},

		checkShow(card) {
			if (card.id_type != undefined && card.id_type != this.id_type) {
				return false;
			}
			if (card.isNeedLogin != undefined) {
				return this.isLogin;
			}
			if (
				card.self_state != undefined &&
				(card.self_state ?
					this.userInfo.self_state != 1 :
					this.userInfo.self_state == 1)
			) {
				return false;
			}
			return true;
		},
		// 去权益界面
		goToRights() {
			// 添加访问检查
			if (this.isAccountDisabled) {
				this.showStopUseModal();
				return;
			}
			uni.navigateTo({
				url: "/subPackages/other/agreement/agreement?type=16&title=权益说明",
			});
		},
		goToWallet() {
			uni.navigateTo({
				url: "/pages/wallet/wallet",
			});
		},
		saveToast() {
			setTimeout(() => {
				uni.showToast({
					title: "保存成功！",
					icon: "none",
				});
			}, 500);
		},
		async getAvatar(e) {
			// 添加访问检查
			if (this.isAccountDisabled) {
				this.showStopUseModal();
				return;
			}
			console.log("getAvatar:", e);
			const tempFilePath = e.detail.avatarUrl; // 获取临时文件路径
			try {
				// 4. 生成唯一文件名（防止OSS文件覆盖，推荐格式：目录/时间戳-随机数.后缀）
				const filename = `${Date.now()}-${Math.floor(
					Math.random() * 1000,
				)}.jpg`;

				// 5. 显示上传中loading（提升用户体验）
				uni.showLoading({
					title: "上传中...",
					mask: true,
				});

				// 6. 调用后端接口，获取OSS临时上传参数（关键：OSS不允许前端直接传密钥，需后端签名）
				const ossConfig = await this.getOssUploadConfig(filename);
				if (!ossConfig) {
					uni.hideLoading();
					uni.showToast({
						title: "获取上传配置失败",
						icon: "none",
					});
					return;
				}

				// 7. 上传图片到阿里云OSS（使用UniApp uploadFile，适配小程序）
				await this.uploadToOss(tempFilePath, ossConfig);

				// 8. 上传成功后续操作（如更新页面头像、通知后端更新用户信息）
				const ossFileUrl = `${ossConfig.host}/${ossConfig.dir}${filename}`; // OSS文件最终URL
				uni.hideLoading();
				uni.showToast({
					title: "头像上传成功",
				});
				console.log("OSS图片URL:", ossFileUrl);
				this.saveProfile(ossFileUrl);
			} catch (error) {
				uni.hideLoading();
				console.error("头像上传异常:", error);
			}
		},
		// 保存资料
		saveProfile(url) {
			// 添加访问检查
			if (this.isAccountDisabled) {
				this.showStopUseModal();
				return;
			}
			uni.showLoading({
				title: "保存中...",
			});
			let head_photo = url;
			let {
				nick_name,
				sex,
				dependency
			} = this.userInfo;
			request
				.post("/syr/User/editUser", {
					nick_name,
					head_photo,
					sex,
					dependency,
				})
				.then((res) => {
					uni.hideLoading();
					this.userInfo.head_photo = url;
					uni.showToast({
						title: "保存成功！",
						icon: "none",
					});
				});
		},
		//调用后端接口，获取OSS临时上传参数（关键：OSS不允许前端直接传密钥，需后端签名）
		async getOssUploadConfig(filename) {
			// 添加访问检查
			if (this.isAccountDisabled) {
				this.showStopUseModal();
				return;
			}
			try {
				// 调用后端接口，传递文件名（后端需根据filename生成对应的dir和key）
				const res = await request.post("/user/getalioss", {
					type: 1, // 后端定义的业务类型（如1=头像）
					kind: 1, // 后端定义的参数（按实际接口调整）
					filename: filename, // 告知后端当前要上传的文件名，用于生成OSS的key
				});
				return {
					...res,
					filename,
				}; // 格式示例：{ host: "https://xxx.oss-cn-beijing.aliyuncs.com", policy: "...", OSSAccessKeyId: "...", signature: "...", dir: "user/avatar/" }
			} catch (error) {
				console.error("获取OSS配置失败:", error);
				throw error;
			}
		},
		//上传oss
		async uploadToOss(tempFilePath, ossConfig) {
			return new Promise((resolve, reject) => {
				// 构造OSS上传的FormData参数（严格按OSS要求的字段名）
				const formData = {
					name: ossConfig.filename, // 文件名（与后端协商的key一致）
					policy: ossConfig.policy, // OSS临时授权policy
					OSSAccessKeyId: ossConfig
						.ossAccessKeyId, // 临时AccessKeyId（注意字段名：后端返回可能是ossAccessKeyId或OSSAccessKeyId，需对齐）
					signature: ossConfig.signature, // 签名
					success_action_status: "200", // OSS上传成功后返回200状态码（必须设置）
					key: ossConfig.dir + ossConfig.filename ||
						ossConfig.dir + tempFilePath.split("/")
							.pop(), // OSS存储的完整key（dir + filename，核心字段）
				};

				// 调用UniApp上传API（小程序推荐用这个，比fetch稳定）
				uni.uploadFile({
					url: ossConfig.host, // OSS的Endpoint（如https://xxx.oss-cn-beijing.aliyuncs.com）
					filePath: tempFilePath, // 小程序临时文件路径
					name: "file", // OSS要求的文件字段名（固定为"file"，后端需与OSS配置一致）
					formData: formData, // OSS上传所需的表单参数
					timeout: 30000, // 超时时间（30秒，防止大文件上传超时）
					success: (uploadRes) => {
						// OSS上传成功的判断：statusCode为200且响应体为空（OSS特性）
						if (uploadRes.statusCode === 200) {
							resolve();
						} else {
							reject(new Error(`OSS上传失败，状态码: ${uploadRes.statusCode}`));
						}
					},
					fail: (err) => {
						reject(new Error(`上传请求失败: ${err.errMsg}`));
					},
				});
			});
		},
		closePopup() {
			this.tipShow = false;
			//uni.showTabBar();
		},

		okBtn() {
			// 添加访问检查
			if (this.isAccountDisabled) {
				this.showStopUseModal();
				return;
			}
			if (this.tipType == "tjRuzhu") {
				getApp().globalData.artisanType = 2;
				if (this.userInfo.is_ok == 2) {
					uni.navigateTo({
						url: "/subPackages/ruzhu/stopuse",
					});
					return;
				}
				//如果现在身份是推荐官认证中身份是推荐官
				if (
					this.userInfo.id_type == 1 &&
					this.userInfo.auth_info?.id_type == 1
				) {
					uni.navigateTo({
						url: "/subPackages/ruzhu/complete?id_type=1",
					});
					return;
				}
				if (!this.userInfo.auth_info?.apply_state) {
					//如果没有认证中信息
					uni.navigateTo({
						url: "/subPackages/ruzhu/complete",
					});
				} else {
					//如果认证中信息apply_state状态不同
					if (this.userInfo.auth_info.apply_state == 1) {
						uni.navigateTo({
							url: "/subPackages/ruzhu/submitres?applyState=1",
						});
					} else if (this.userInfo.auth_info.apply_state == 2) {
						uni.navigateTo({
							url: "/subPackages/ruzhu/submitres?applyState=2",
						});
					} else if (this.userInfo.auth_info.apply_state == 3) {
						uni.navigateTo({
							url: "/subPackages/ruzhu/submitres?applyState=3",
						});
					}
				}
			} else if (this.tipType == "login") {
				uni.navigateTo({
					url: "/pages/blogPopup/blogPopup",
				});
			}
			// uni.showTabBar();
		},
		getUserInfo() {
			request.post("/sj/user/getUser").then((result) => {
				this.userInfo = result.data;
				uni.setStorageSync("syrId", result.data.id);
			});
			this.getInviteList();
		},
		async goLogin() {
			// 添加访问检查
			if (this.isAccountDisabled) {
				this.showStopUseModal();
				return;
			}
			this.tipsText = "您现在还未登录，是否确定登录？";
			this.tipShow = true;
			this.tipType = "login";
			uni.hideTabBar();
		},

		goToOrderList(type) {
			// 添加访问检查
			if (this.isAccountDisabled) {
				this.showStopUseModal();
				return;
			}
			if (!this.isLogin) {
				uni.showToast({
					title: "您暂未登录，无法使用此功能！",
					icon: "none",
				});
				return;
			}
		},
		logout() {
			uni.showModal({
				title: "提示",
				content: "确定要退出登录吗？",
				success: (res) => {
					if (res.confirm) {
						// uni.removeStorageSync('access_token');
						// uni.removeStorageSync('refresh_token');
						uni.clearStorageSync();
						// TODO: 实现退出登录逻辑
						uni.reLaunch({
							url: "/pages/home/home",
						});
					}
				},
			});
		},
		async handleFunction(item) {
			// 如果是退出登录，直接处理，不检查账号状态
			if (this.isLogin && item.type === "setting") {
				uni.navigateTo({
					url: `/pages/settings/index`,
				});
				return;
			}

			// 检查账号状态，如果不允许访问，直接返回
			if (!this.checkAccess(item)) {
				return;
			}

			// if (!this.isLogin) {
			//   uni.showToast({
			//     title: "您暂未登录，无法使用此功能！",
			//     icon: "none",
			//   });
			//   return;
			// }

			if (item.path == "/pages/ruzhu/ruzhu") {
				request.post("/sj/userSjAuth/details", {
					type: 1
				}).then((res) => {
					if (res.code == 200 && res.data && res.data.apply_state != 2) {
						uni.navigateTo({
							url: `/pages/ruzhu/submitres?identity=${res.data.id_type}&applyState=${res.data.apply_state}`,
						});
					} else {
						uni.navigateTo({
							url: item.path,
						});
					}
				});

				return;
			}
			if (item.type) {
				uni.navigateTo({
					url: `${item.path}?type=${item.type}`,
				});
			} else {
				if (item.go_id_type == 1 && this.userInfo?.id_type == 0) {
					uni.showToast({
						title: `您暂未入驻，无法使用${item.title}！`,
						icon: "none",
					});
					return;
				}
				if (!this.isLogin && item.go_id_type) {
					uni.showToast({
						title: `您暂未登录，无法使用${item.title}！`,
						icon: "none",
					});
					return;
				}
				uni.navigateTo({
					url: `${item.path}`,
				});
			}
		},
		goToProfile() {
			// 添加访问检查
			if (this.isAccountDisabled) {
				this.showStopUseModal();
				return;
			}
			if (this.userInfo.id_type == 0) {
				return;
			}
			uni.navigateTo({
				url: "/pages/artisan/profile",
			});
		},
		goToInviteList() {
			// 添加访问检查
			if (this.isAccountDisabled) {
				this.showStopUseModal();
				return;
			}
			if (this.userInfo.id_type == 0) {
				return;
			}
			uni.navigateTo({
				url: "/subPackages/affiliated/inviteList?type=" + this.id_type,
			});
		},
		getInviteList() {
			request
				.post("/syr/sjSyrBind/inviteList", {
					page: 1,
					limit: 999
				})
				.then((res) => {
					this.inviteList = res.data.list;
				});
		},
		goTypeSelect() {
			// 添加访问检查
			if (this.isAccountDisabled) {
				this.showStopUseModal();
				return;
			}
			request
				.post("/syr/userSyrAuth/details", {
					type: 1,
					id_type: 1
				})
				.then((res) => {
					if (res.code == 200 && res.data && res.data.apply_state != 2) {
						uni.navigateTo({
							url: `/subPackages/ruzhu/submitres?identity=${res.data.id_type}&applyState=${res.data.apply_state}`,
						});
					} else {
						uni.navigateTo({
							url: "/subPackages/ruzhu/typeSelect?id_type=1",
						});
					}
				});
		},
	},
};
</script>

<style lang="less">
page {
	background: #f5f5f5 !important;
}

.my-page {
	/* min-height: 100vh; */
	position: relative;
	padding-bottom: 50rpx;
	padding-top: var(--status-bar-height);
	background-image: url("https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/825812de-54b3-486a-a3a0-2c4a1fb9fd28.png");
	background-position: 0 0;
	background-size: 100%;
	background-repeat: no-repeat;
	padding-bottom: 150rpx;
}

// .my-page::before {
//   content: "";
//   position: fixed;
//   top: 0;
//   left: 0;
//   right: 0;
//   height: 489rpx !important;
//   background-image: url("https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/825812de-54b3-486a-a3a0-2c4a1fb9fd28.png");
//   background-size: cover;
//   background-position: center top;
//   background-repeat: no-repeat;
//   z-index: -1;
// }

/* 确保内容在背景之上 */
.user-section,
.order-section,
.function-list,
.user-stats,
.image-list,
.imageText-list,
.info_section {
	position: relative;
	z-index: 99;
	margin: 0 30rpx;
}

/* 用户信息区域 */
.user-section {
	background-color: transparent;
	box-sizing: border-box;
	padding-bottom: 40rpx;
	padding-top: 26rpx;

	.upgradeBanner {
		padding-top: 40rpx;
		width: 690rpx;
		height: 114rpx;
		position: relative;

		.upgradeBanner-img {
			width: 690rpx;
			height: 114rpx;
		}

		.upgradeBanner-btn {
			position: absolute;
			left: 304rpx;
			bottom: 20rpx;
			width: 100rpx;
			height: 40rpx;
		}
	}

	.user-info {
		display: flex;
		flex-flow: row nowrap;
		justify-content: space-between;
		align-items: center;

		.user-info-left {
			display: flex;
			flex-flow: row nowrap;
			justify-content: flex-start;
			align-items: center;

			.avatar {
				width: 124rpx;
				height: 124rpx;
				border: 4rpx solid #fff;
				box-sizing: border-box;
				border-radius: 64rpx;
				margin-right: 20rpx;
				overflow: hidden;
				position: relative;

				.avatar-img {
					width: 116rpx;
					height: 116rpx;
					border-radius: 64rpx;
					margin-right: 20rpx;
				}

				.avatar-button {
					position: absolute;
					inset: 0;
					margin: auto;
				}
			}

			.user-detail {
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: flex-start;

				.nickname {
					font-weight: 500;
					font-size: 32rpx;
					color: #333333;
					line-height: 45rpx;
					text-align: left;
					font-style: normal;
					display: flex;
					align-items: center;
					justify-content: center;

					.nickname-text {
						max-width: 250rpx;
						white-space: nowrap;
						overflow: hidden;
						text-overflow: ellipsis;
					}

					.inviteCode {
						padding: 6rpx;
						font-weight: 400;
						font-size: 20rpx;
						color: #7e4e5b;
						line-height: 28rpx;
						text-align: left;
						font-style: normal;
						background: rgba(255, 255, 255, 0.3);
						border-radius: 6rpx;
						margin-left: 6rpx;
					}
				}

				.user-detail-tip {
					font-weight: 400;
					font-size: 22rpx;
					color: #999999;
					line-height: 30rpx;
					text-align: left;
					font-style: normal;
					margin-top: 12rpx;
				}

				.user-identity {
					margin-top: 10rpx;
					border: 1rpx solid #e8101e;
					border-radius: 22rpx;
					width: 112rpx;
					height: 44rpx;
					line-height: 44rpx;
					text-align: center;
					background-color: rgba(255, 241, 241, 1);

					.identity-text {
						font-size: 20rpx;
						color: #e8101e;
						font-weight: 400;
					}
				}
			}
		}

		.user-info-right {
			transform: translateY(14rpx);

			.wallet_content {
				height: 48rpx;
				padding: 0rpx 16rpx;
				display: flex;
				align-items: center;
				background: rgba(252, 67, 124, 0.1);
				border-radius: 24rpx;
				border: 1rpx solid rgba(232, 16, 30, 0.15);
			}

			.wallet_content_img {
				width: 29rpx;
				height: 29rpx;
				margin-right: 2rpx;
			}

			.wallet_content_text {
				font-family:
					PingFangSC,
					PingFang SC;
				font-weight: 500;
				font-size: 22rpx;
				color: #666666;
				line-height: 30rpx;
				text-align: left;
			}
		}
	}
}

.authentication {
	display: flex;
	margin-top: 20rpx;

	.authentication_content {
		height: 48rpx;
		padding: 0rpx 20rpx;
		display: flex;
		align-items: center;
		background: #ffe8e8;
		border-radius: 24rpx;
		border: 1rpx solid rgba(232, 16, 30, 0.19);

		.authentication_img {
			width: 27rpx;
			height: 29rpx;
			margin-right: 7rpx;
		}

		.authentication_text {
			font-family:
				PingFangSC,
				PingFang SC;
			font-weight: 500;
			font-size: 26rpx;
			line-height: 37rpx;
			color: #333333;
		}
	}
}

.inviteMessage {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 54rpx;
	background: linear-gradient(320deg, #ffffff 0%, #ffffff 100%);
	border-radius: 19rpx;
	padding-right: 40rpx;

	.inviteMessage_content {
		height: 80rpx;
		padding: 0rpx 20rpx;
		display: flex;
		align-items: center;
		border-radius: 24rpx;

		.inviteMessage_img {
			width: 42rpx;
			height: 42rpx;
			margin-right: 20rpx;
			flex-shrink: 0;
		}

		.inviteMessage_text {
			font-family:
				PingFangSC,
				PingFang SC;
			font-weight: 500;
			font-size: 26rpx;
			line-height: 37rpx;
			color: #333333;
		}
	}

	.btn_img {
		width: 130rpx;
		height: 54rpx;
	}
}

.bottom0 {
	margin-bottom: 0;
}

.user-stats {
	border-radius: 20rpx;
	background-color: #fff;
	box-shadow: 0 4rpx 8rpx 0 rgba(0, 0, 0, 0.05);
	display: flex;
	justify-content: space-around;
}

.stat-item {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.stat-icon {
	width: 64rpx;
	height: 64rpx;
	margin-bottom: 8rpx;
}

.stat-label {
	font-size: 26rpx;
	color: #252525;
	font-weight: 400;
}

.order-card {
	// background: linear-gradient(180deg, #FBF5F8 0%, #F6F6F6 100%);
	border-radius: 30rpx 30rpx 0rpx 0rpx;
	// padding-top: 30rpx;
	display: flex;
	flex-direction: column;
	gap: 20rpx;
}

/* 订单状态区域 */
.order-section {
	background: #ffffff;
	box-shadow: 0rpx 4rpx 16rpx 0rpx rgba(210, 213, 224, 0.5);
	border-radius: 24rpx;
	margin-bottom: 24rpx;
	padding: 30rpx 20rpx 40rpx 20rpx;

	.order-title {
		font-weight: 500;
		font-size: 32rpx;
		color: #333333;
		line-height: 45rpx;
		text-align: left;
		font-style: normal;
		margin-bottom: 30rpx;
	}

	.order-status {
		display: flex;
		justify-content: space-between;
		padding: 0rpx;
		box-sizing: border-box;

		.status-item {
			display: flex;
			flex-direction: column;
			align-items: center;

			.status-icon {
				width: 200rpx;
				height: 169rpx;
			}
		}
	}
}

/* 功能列表 */
.function-list {
	background: #ffffff;
	border-radius: 24rpx;
	padding: 30rpx;
	padding-bottom: 50rpx;

	.function-title {
		font-weight: 500;
		font-size: 32rpx;
		color: #252525;
		line-height: 36rpx;
		text-align: left;
		font-style: normal;
		margin-bottom: 50rpx;
	}

	.function-grid {
		display: flex;
		flex-direction: column;
		gap: 63rpx;

		.grid-item {
			display: flex;
			align-items: center;
			position: relative;
			gap: 21rpx;

			.icon-wrapper {
				width: 42rpx;
				height: 42rpx;
				position: relative;
				// margin-bottom: 12rpx;

				.grid-icon {
					width: 42rpx;
					height: 42rpx;
				}
			}

			.grid-text {
				font-weight: 400;
				font-size: 30rpx;
				color: #333333;
				line-height: 42rpx;
				text-align: left;
				font-style: normal;
			}
		}

		.grid-item::after {
			position: absolute;
			content: "";
			width: 12rpx;
			height: 24rpx;
			right: 0rpx;
			background-image: url("https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/gray_right_icon.png");
			background-size: cover;
		}
	}

	.lineCard-title {
		font-weight: 500;
		font-size: 32rpx;
		color: #252525;
		line-height: 36rpx;
		text-align: left;
		font-style: normal;
		margin-bottom: 24rpx;
	}

	.lineCard-grid {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		gap: 20rpx 0;

		image {
			width: 310rpx;
			height: 120rpx;
		}
	}
}

/* 功能列表 */
.listcard-list {
	position: relative;
	z-index: 99;
	margin: 0 30rpx;
	background: #ffffff;
	border-radius: 24rpx;
	padding: 30rpx 20rpx;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;

	.function-title {
		width: 100%;
		font-weight: 500;
		font-size: 32rpx;
		color: #252525;
		line-height: 36rpx;
		text-align: left;
		font-style: normal;
		margin-bottom: 20rpx;
	}

	.listcard-item {
		width: 33.33%;
		padding: 20rpx;
		box-sizing: border-box;

		image {
			width: 50rpx;
			height: 50rpx;
			margin: 0 auto 10rpx;
			display: block;
		}

		.listcard-title {
			font-weight: 500;
			font-size: 28rpx;
			color: #252525;
			line-height: 32rpx;
			text-align: center;
			margin-bottom: 8rpx;
		}

		.listcard-text {
			font-size: 24rpx;
			color: #999999;
			line-height: 28rpx;
			text-align: center;
		}
	}
}

.image-list {
	background: #ffffff;
	border-radius: 24rpx;
	padding: 30rpx 20rpx;

	.image-title {
		font-weight: 500;
		font-size: 32rpx;
		color: #252525;
		line-height: 36rpx;
		text-align: left;
		font-style: normal;
		margin-bottom: 20rpx;
	}

	image {
		width: 100%;
		height: 148rpx;
	}
}

.imageText-list {
	background: #ffffff;
	border-radius: 24rpx;
	padding: 29rpx 27rpx 40rpx;

	.imageText-title {
		font-weight: 500;
		font-size: 32rpx;
		color: #252525;
		line-height: 36rpx;
		text-align: left;
		font-style: normal;
		margin-bottom: 11rpx;
	}

	.imageText-content {
		display: flex;
		flex-direction: column;
		align-items: center;

		image {
			width: 245rpx;
			height: 171rpx;
		}

		.text-status {
			font-family:
				PingFangSC,
				PingFang SC;
			font-weight: 500;
			font-size: 30rpx;
			color: #000000;
			margin-top: 20rpx;
			margin-bottom: 22rpx;
		}

		.text-next {
			font-family:
				PingFangSC,
				PingFang SC;
			font-weight: 400;
			font-size: 26rpx;
			line-height: 37rpx;
			color: #666666;
			text-align: center;
		}
	}
}

.my-page::before {
	height: 420rpx;
}

button {
	background: transparent !important;
	border: none !important;
	border-radius: 0 !important;
	padding: 0 !important;
	min-width: auto !important;
	height: auto !important;
	line-height: normal !important;
	color: inherit !important;
	-webkit-tap-highlight-color: transparent !important;
}

button::after {
	border: none !important;
}


.info_section {
	display: flex;
	justify-content: space-between;
	margin-bottom: 20rpx;

	.info_section_item {
		width: 336rpx;
		height: 193rpx;
		background-size: cover;
		background-position: center;
		box-sizing: border-box;
		display: flex;
		flex-direction: column;
		padding: 23rpx 26rpx 20rpx 26rpx;

		.info_section_item_header {
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding-bottom: 16rpx;
			border-bottom: 2rpx solid rgba(210, 213, 224, 0.15);

			.info_section_item_header_left {
				display: flex;
				align-items: center;
				gap: 11rpx;
			}

			.info_section_item_img {
				width: 35rpx;
				height: 38rpx;
			}

			.info_section_item_label {
				font-weight: 500;
				font-size: 30rpx;
				color: #333333;
				line-height: 38rpx;
				text-align: left;
				font-style: normal;
			}

			.info_section_item_header_right {
				image {
					width: 10rpx;
					height: 20rpx;
				}
			}
		}

		.info_section_item_subtitle {
			font-size: 22rpx;
			color: #999999;
			line-height: 30rpx;
			margin-top: 12rpx;
			margin-bottom: 6rpx;
		}

		.info_section_item_content {
			display: flex;
			align-items: baseline;
			font-family: DINPro, DINPro;
			font-weight: 500;
			font-size: 36rpx;
			color: #333333;

			.info_section_item_content_unit {
				font-family:
					PingFangSC,
					PingFang SC;
				font-weight: 500;
				font-size: 20rpx;
				color: #333333;
				margin-left: 3rpx;
			}
		}
	}
}

.user_detail_tip {
	display: flex;
	align-items: center;
	gap: 12rpx;
	margin-top: 10rpx;

	.user_detail_tip_phone {
		max-width: 230rpx;
		height: 36rpx;
		line-height: 36rpx;
		border-radius: 6rpx;
		font-size: 24rpx;
		color: #666666;
		box-sizing: border-box;
		display: flex;
		align-items: center;
		gap: 7rpx;

		image {
			width: 8rpx;
			height: 14rpx;
		}
	}

	.user_detail_tip_invite_name {
		max-width: 246rpx;
		font-size: 22rpx;
	}
}

.imagePure {
	width: 690rpx;
	margin: 0 auto;

	image {
		width: 100%;
	}
}
</style>